webpack4 公共模块打包,怎么抽取出来一个需要经常修改的包

项目中有一个需求:

所有页面引用了一个公共ad.js 因为广告需要不断投放新渠道,所以ad.js需要经常上线更新,这样会导致打包出来的

commons.js经常更新,缓存一下无效了.所以急需将ad.js抽取出来,自己打包成一个JS
现在入口定义

entry['ad'] = path.resolve(dirlets.libsDir, 'ad.channel.js')
插件代码设置为:

new webpack.optimize.SplitChunksPlugin({
        chunks: 'all',
        minSize: 30000,
        minChunks: 1,
        maxAsyncRequests: 5,
        maxInitialRequests: 3,
        automaticNameDelimiter: '-',
        name: true,
        cacheGroups: {
            'ad': {
                name: 'ad',
                test: path.resolve(dirlets.libsDir, 'ad.channel.js'),
                minChunks: 8,
                maxInitialRequests: 5,
                minSize: 0,
                priority: 2,
            },
            commons: {
                name: 'commons',
                minChunks: 8,
                maxInitialRequests: 5,
                minSize: 0,
                priority: 1,
            },
        }
    }),

　　

test设置很重要:可以设置正则,字符串,用来将匹配到的文件打包出来.
可以参考这个链接.https://juejin.im/post/5af15e895188256715479a9a

priority这个设置是我不断尝试后发现的.
如果不设置这个属性的话,后边commons打包的JS会包含ad chunk打包出来的包.这样就重复无意义了.

但是将commons的priority优先级设置比ad的priority数值低的话.打包出来的就不会包含了.
以上2个配置缺一不可.多次尝试后发现的.

转载于:https://www.cnblogs.com/chengfeng6/p/9871592.html