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個配置缺一不可.多次嘗試后發現的.
 
       


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM