vue 插件 pwa sw.js 未找到

Posted 2023-02-22

【中文标题】vue 插件 pwa sw.js 未找到

【英文标题】：vue plugin pwa sw.js not found

【发布时间】：2021-06-23 04:50:10

【问题描述】：

我有 1 个使用 vue pwa 插件的应用，效果很好。

应用程序的 vuejs 配置如下所示：

const WebpackNotifierPlugin = require('webpack-notifier')

module.exports = 
  lintOnSave: false,
  css: 
    loaderOptions: 
      sass: 
        implementation: require('sass')
      
    
  ,
  transpileDependencies: [
    'vuex-module-decorators',
    'vuex-persist'
  ],
  pwa: 
    name: 'MyApp',
    themeColor: '#000000',
    msTileColor: '#000000',
    appleMobileWebAppCapable: 'yes',
    appleMobileWebAppStatusBarStyle: 'black',

    // configure the workbox plugin
    workboxPluginMode: 'InjectManifest',
    workboxOptions: 
      // swSrc is required in InjectManifest mode.
      swSrc: 'dev/sw.js',
      // ...other Workbox options...
    
  ,
  configureWebpack: 
    devServer:
      historyApiFallback: true,
    ,
    plugins: [
      new WebpackNotifierPlugin(),
    ],
    optimization: 
      runtimeChunk: 'single',
      splitChunks: 
        chunks: 'all',
        maxInitialRequests: 3,
        minSize: 0,
        cacheGroups: 
          vendor: 
            test: /[\\/]node_modules[\\/]/,
            name(module) 
              const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
              return `npm.$packageName.replace('@', '')`;
            ,
          ,
        ,
      ,
    ,
  ,

我有另一个应用程序，完全相同，vue2，beufy 等。我通过 vue pwa 插件安装了相同的东西，配置看起来完全相同，但是当我运行构建时它说它找不到 sw.js文件：

Error: ENOENT: no such file or directory, open 'dev/sw.js'

我创建了一个超级基本的 vue 应用程序，在这里做同样的事情：https://github.com/johndcarmichael/vue-pwa-sw-not-found

还有其他人遇到过这个问题吗？您是如何解决的？

【参考方案1】：

您的项目中没有dev/sw.js，正如您在swSrc 中设置的那样。 InjectManifest 表示获取此sw.js 源文件并将预缓存清单写入其中，生成最终的service-worker.js 文件。

【讨论】：

好的，但是你有可以与这个插件一起使用的示例服务工作者文件的链接吗？

cli.vuejs.org/core-plugins/pwa.html#example-configuration不提供一个

@John 只需删除 workboxPluginMode 和 workboxOptions。 cli-plugin-pwa 将使用合理的默认值。

非常感谢！我没有从文档中得到。现在一切正常！不知道原始应用程序是如何构建的，但是由于我使用的是默认设置，因此我从两个配置中删除了这些选项，一切都很好。