vue-cli3項(xiàng)目生產(chǎn)和測試環(huán)境分包后文件名和數(shù)量不一致解決
更新時間：2023年05月29日 09:57:09 作者：zoufengrui
這篇文章主要為大家介紹了vue-cli3項(xiàng)目生產(chǎn)和測試環(huán)境分包后文件名和數(shù)量不一致解決方法，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
正文
我用vue-cli3搭建的項(xiàng)目，在進(jìn)行webpack按需分包之后，生產(chǎn)環(huán)境打包和測試環(huán)境打包出來的文件名和數(shù)量不一致：
對于生產(chǎn)環(huán)境的包，能正確的將文件按照頁面分包打包出來，而測試環(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("@", "")}`;
},
},
},
},
};
},請問如何改能將測試環(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會有一些process.env.NODE_ENV === 'test'的判斷，所以想和線上環(huán)境一樣最簡單的辦法就是不用它的mode
"build": "vue-cli-service build", "uat": "vue-cli-service build --mode mytest",
以上就是vue-cli3項(xiàng)目生產(chǎn)和測試環(huán)境分包后文件名和數(shù)量不一致解決的詳細(xì)內(nèi)容，更多關(guān)于vue-cli3分包文件不一致的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
最近在寫vue的一個項(xiàng)目要實(shí)現(xiàn)過渡的效果,雖然vue動畫不是強(qiáng)項(xiàng),庫也多,但是基本的坑還是得踩扎實(shí),下面這篇文章主要給大家介紹了關(guān)于Vue中實(shí)現(xiàn)過渡動畫效果的相關(guān)資料,需要的朋友可以參考下2023-01-01
這篇文章主要介紹了Vue的土著指令和自定義指令的用法講解 ,需要的朋友可以參考下2018-02-02
這篇文章主要介紹了vue移動端項(xiàng)目vant組件庫之tag詳解，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
vue和better-scroll實(shí)現(xiàn)列表左右聯(lián)動效果詳解
這篇文章主要介紹了vue和better-scroll實(shí)現(xiàn)列表左右聯(lián)動效果，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
Vue2.0基于vue-cli+webpack父子組件通信(實(shí)例講解)
下面小編就為大家?guī)硪黄猇ue2.0基于vue-cli+webpack父子組件通信(實(shí)例講解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
這篇文章主要為大家詳細(xì)介紹了vue+iview實(shí)現(xiàn)分頁及查詢功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11
使用vue + less 實(shí)現(xiàn)簡單換膚功能的示例
下面小編就為大家分享一篇使用vue + less 實(shí)現(xiàn)簡單換膚功能的示例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02
這篇文章主要介紹了vue3編寫組件的幾種實(shí)現(xiàn)方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-06-06
vue中使用Cesium加載shp文件、wms服務(wù)、WMTS服務(wù)問題
這篇文章主要介紹了vue中使用Cesium加載shp文件、wms服務(wù)、WMTS服務(wù)問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-05-05
本篇文章主要介紹了vue2組件之select2調(diào)用的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10