小编Tho*_*ing的帖子

在我们的项目中,我们使用webpack-dev-server来运行我们的开发环境.我们目前正在使用工作箱将项目转换为渐进式网络应用程序.

当我们使用NODE_ENV = production运行webpack时,一切正常,因为它首先编译文件,然后工作箱插件将它们拾取并将它们添加到服务工作者.

当我们运行webpack-dev-server hot时,运行workbox插件时构建失败,因为它找不到dist文件夹中的任何文件.

问题似乎是工作箱没有拾取内存中生成的js和css文件,似乎需要文件系统上的文件.

module.exports = {
  context: path.resolve(__dirname, 'front'),
  entry: [
    ...preEntries,
    './react/app.js'
  ],
  output: {
    path: path.resolve(__dirname, 'front-dist'),
    filename: `react/app.${git.gitCommitAbbrev}.js`,
    chunkFilename: `react/[id].app.${git.gitCommitAbbrev}.js`,
    publicPath: '/glass/'
  },
  devtool: isProdEnv ? false : 'eval-source-map',
  stats: {
    chunkModules: false
  },
  module: {
    ...
  },
  plugins: [
    new WorkboxPlugin({
      globDirectory: path.resolve(__dirname, 'front-dist'),
      globPatterns: ['**/*.{html,js,css,woff2}'],
      swDest: path.join(path.resolve(__dirname, 'front-dist/sw/'), 'service-worker.js'),
      handleFetch: true,
      clientsClaim: true,
      skipWaiting: true,
    })
  ]
}

任何关于如何工作的想法