构建 vue 3 时未生成服务人员

Question

我已经在我的 package.json 中安装了 "@vue/cli-plugin-pwa": "^4.5.12",，我还在我的 vue.config.js 中添加了工作箱配置。问题是，当我使用 npm run build:prd 构建项目时，它有我的脚本：vue-cli-service build --mode prod.example，我的 dist 文件夹中没有 service-worker.js。

这是我的 vue.config.js:

module.exports = {
    // ...other vue-cli plugin options...
    pwa: {
        // configure the workbox plugin
        workboxPluginMode: 'InjectManifest',
        workboxOptions: {
            // swSrc is required in InjectManifest mode.
            swSrc: 'src/service-worker.js',
            // ...other Workbox options...
        }
    }
}

我尝试将 pwa 插件配置移到 package.json 中，但效果不佳。我只是在我的 dist 文件夹中找不到我的 service-worker.js。

当前的解决方法是将 service-worker.js 放在 pubic 文件夹中。这种方法的问题是每次有新版本发布时，service worker 根本不会更新。目前的目的是在新版本可用时通知客户端，但我无法触发 update 事件，因为 service-worker.js 是静态的

Answer 1

我发现了问题，如果process.env.NODE_ENV === 'production'，@vue/cli-plugin-pwa只会生成service-worker。同时在我的项目中，当我运行 npm run build 时 NODE_ENV 不会自动设置为 production 但它仍然是 development 我不知道是什么原因造成的行为，但如果我在所有 .env 中添加 NODE_ENV=production，问题就解决了。有了这个，precache-manifest....js 将在每次构建时生成。

构建 vue 3 时未生成服务人员

Service worker not generated when building vue 3

javascript

vue.js

service-worker

progressive-web-apps