webpack4 splitChunks提取问题

发布于 2022-09-11 18:24:17 字数 918 浏览 9 评论 0

我搭建的是一个单页应用
想用webpack4下的splitChunks功能想将node_modules引用的模块比如
vue之类的提取放到一个js文件下
但是怎么提都提不出来
一点反应都没有,
这是怎么回事?

optimization: {
        splitChunks: {
            chunks: 'initial', //默认只作用于异步模块,为`all`时对所有模块生效,`initial`对同步模块有效
            minSize: 30000, //合并前模块文件的体积
            minChunks: 1, //最少被引用次数
            maxAsyncRequests: 5,
            maxInitialRequests: 3,
            automaticNameDelimiter: '~',
            cacheGroups: {
                vendors: {
                     test: /node_modules/,
                     minChunks: 1,
                     priority: -10
                },
                default: {
                     test: /src/,
                     minChunks: 2,
                     priority: -20,
                     reuseExistingChunk: true
                }
            }
        }
    },

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

顾挽 2022-09-18 18:24:17
 optimization: {
    runtimeChunk: {
      name: 'manifest'
    },
    splitChunks: {
      maxInitialRequests: 10,
      cacheGroups: {        
        vendor: {
          test: /(babel|jquery|fastclick|vue.esm.js)/,
          name: 'vendor',
          chunks: 'all'
        }        
      }
    }
}
夏尔 2022-09-18 18:24:17

找到问题的原因了,是加了下面这个东西
导致和splitChunks有冲突

new webpack.optimize.MinChunkSizePlugin({minChunkSize: 30000}),
和我恋爱吧 2022-09-18 18:24:17
splitChunks: {
      cacheGroups: {
        manifest: {
          name: "manifest",
          chunks: "initial",
          minChunks: 2
        },
       
        vendor: {
          chunks: "all",
          test: /[\\/]node_modules[\\/]/,
          name: "vendor",
          minChunks: 1,
          maxInitialRequests: 5,
          minSize: 0,
          priority: 98
        }
      }
    }
  },
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文