小编Kir*_*lat的帖子

如何将生成的 PWA 清单包含到由 Workbox 呈现的预缓存清单中

我有一个 Webpack 配置文件,它使用webpack-pwa-manifest插件 ( https://github.com/arthurbergmz/webpack-pwa-manifest ) 生成 PWA 清单文件。清单文件名为manifest.hash.json,其中“hash”是在每次构建时动态生成的值。

我还使用(https://developers.google.com/web/tools/workbox/modules/workbox-webpack-pluginInjectManifest )插件来渲染预缓存清单,然后将其注入到服务工作线程文件中。Workbox

这是我的 Webpack 配置文件的“插件”部分:

      plugins: [
        new CleanWebpackPlugin([ path.join(destDir, '*.*') ], {
        allowExternal: true,
        exclude: [],
        verbose: true,
        dry: false
      }),
      new MiniCssExtractPlugin({
        filename: 'style.[hash].css'
      }),
      new VueLoaderPlugin(),
      new HtmlWebpackPlugin({
        template: path.join(projectRoot, 'src/index.html')
      }),
      new WebpackPwaManifest({
        name: 'Test PWA',
        short_name: 'Test PWA',
        fingerprints: true,
        inject: true,
        lang: 'en-US',
        start_url: 'https://localhost:8120/index.html',
        display: 'standalone',
        theme_color: '#777777',
        background_color: '#333333',
        icons: [
          {
            src: path.join(sourceDir, 'images/icon.png'),
            sizes: …
Run Code Online (Sandbox Code Playgroud)

webpack workbox

5
推荐指数
1
解决办法
4261
查看次数

标签 统计

webpack ×1

workbox ×1