vue-cli3項(xiàng)目生產(chǎn)和測(cè)試環(huán)境分包后文件名和數(shù)量不一致解決
正文
我用vue-cli3搭建的項(xiàng)目，在進(jìn)行webpack按需分包之后，生產(chǎn)環(huán)境打包和測(cè)試環(huán)境打包出來(lái)的文件名和數(shù)量不一致：
對(duì)于生產(chǎn)環(huán)境的包，能正確的將文件按照頁(yè)面分包打包出來(lái)，而測(cè)試環(huán)境的打包只能打包成1.js,2.js這種，并且少了chunk.js
我的vue.config.js配置如下
chainWebpack: config => {
config.resolve.alias
.set("@", resolve("./src"))
.set("assets", resolve("src/assets"))
.set("components", resolve("src/components"))
.set("containers", resolve("src/containers"))
.set("service", resolve("src/service"))
.set("utils", resolve("src/utils"))
.set("store", resolve("src/store"))
.set("config", resolve("src/config"))
.set("pubilc", resolve("pubilc"));
config.output.filename("static/js/[name].[hash].js").end();
},
configureWebpack: config => {
config.optimization = {
runtimeChunk: "single",
splitChunks: {
chunks: "all",
maxInitialRequests: Infinity,
minSize: 20000,
cacheGroups: {
vendor: {
test: /[\\/]node_modules[\\/]/,
name(module) {
const packageName = module.context.match(
/[\\/]node_modules[\\/](.*?)([\\/]|$)/
)[1];
return `npm.${packageName.replace("@", "")}`;
},
},
},
},
};
},請(qǐng)問如何改能將測(cè)試環(huán)境的打包內(nèi)容改成和生產(chǎn)環(huán)境一樣呢？
補(bǔ)充 package.json里面的命令
"build": "vue-cli-service build", "uat": "vue-cli-service build --mode test",
因?yàn)?code>vue-cli的test會(huì)有一些process.env.NODE_ENV === 'test'的判斷，所以想和線上環(huán)境一樣最簡(jiǎn)單的辦法就是不用它的mode
"build": "vue-cli-service build", "uat": "vue-cli-service build --mode mytest",
以上就是vue-cli3項(xiàng)目生產(chǎn)和測(cè)試環(huán)境分包后文件名和數(shù)量不一致解決的詳細(xì)內(nèi)容，更多關(guān)于vue-cli3分包文件不一致的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
最近在寫vue的一個(gè)項(xiàng)目要實(shí)現(xiàn)過渡的效果,雖然vue動(dòng)畫不是強(qiáng)項(xiàng),庫(kù)也多,但是基本的坑還是得踩扎實(shí),下面這篇文章主要給大家介紹了關(guān)于Vue中實(shí)現(xiàn)過渡動(dòng)畫效果的相關(guān)資料,需要的朋友可以參考下2023-01-01
這篇文章主要介紹了Vue的土著指令和自定義指令的用法講解 ,需要的朋友可以參考下2018-02-02
vue移動(dòng)端項(xiàng)目vant組件庫(kù)之tag詳解
這篇文章主要介紹了vue移動(dòng)端項(xiàng)目vant組件庫(kù)之tag詳解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
vue和better-scroll實(shí)現(xiàn)列表左右聯(lián)動(dòng)效果詳解
這篇文章主要介紹了vue和better-scroll實(shí)現(xiàn)列表左右聯(lián)動(dòng)效果，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
Vue2.0基于vue-cli+webpack父子組件通信(實(shí)例講解)
下面小編就為大家?guī)?lái)一篇Vue2.0基于vue-cli+webpack父子組件通信(實(shí)例講解)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2017-09-09
vue+iview實(shí)現(xiàn)分頁(yè)及查詢功能
這篇文章主要為大家詳細(xì)介紹了vue+iview實(shí)現(xiàn)分頁(yè)及查詢功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-11-11
使用vue + less 實(shí)現(xiàn)簡(jiǎn)單換膚功能的示例
下面小編就為大家分享一篇使用vue + less 實(shí)現(xiàn)簡(jiǎn)單換膚功能的示例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2018-02-02
這篇文章主要介紹了vue3編寫組件的幾種實(shí)現(xiàn)方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
vue中使用Cesium加載shp文件、wms服務(wù)、WMTS服務(wù)問題
這篇文章主要介紹了vue中使用Cesium加載shp文件、wms服務(wù)、WMTS服務(wù)問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-05-05
本篇文章主要介紹了vue2組件之select2調(diào)用的示例代碼，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2017-10-10