vuepress 配置 PWA

VuePress 是一个以 Markdown 为中心的静态网站生成器，可以通过简单的配置生成现代的单页应用。PWA（Progressive Web App）是一种可以提供类似于原生应用体验的网页应用。要在 VuePress 中配置 PWA 功能，你可以按照以下步骤操作：

1. 在项目根目录下创建或编辑 `.vuepress/config.js` 文件。

2. 安装 `vuepress-plugin-pwa` 插件，可以通过 npm 或 yarn 安装：

   npm install vuepress-plugin-pwa -D
   # 或者
   yarn add vuepress-plugin-pwa -D

3. 在 `.vuepress/config.js` 文件中引入并使用该插件，并配置必要的选项，例如：

   module.exports = {
     plugins: {
       'pwa': {
         serviceWorker: true,
         updatePopup: true,
         // 其他选项...
       }
     }
   }

4. 创建一个 manifest 文件，通常命名为 `manifest.json`，并放置在 `.vuepress/public` 目录下，该文件包含 PWA 的配置信息，例如：

   {
     "name": "你的应用名称",
     "short_name": "应用简称",
     "description": "应用描述",
     "start_url": "/",
     "display": "standalone",
     "background_color": "#fff",
     "theme_color": "#3eaf7c",
     "icons": [
       {
         "src": "/assets/icon.png",
         "sizes": "152x152",
         "type": "image/png"
       }
       // 更多图标配置...
     ]
   }

5. 确保你的 VuePress 网站可以访问到 manifest 文件和注册 service worker。

6. 访问你的 VuePress 网站并进行测试，确保 PWA 功能正常工作。