vue-cli3打包后webpack配置发生了变化

Question

项目中要加一个测试环境，打包之后根据环境去区分请求路径。以上为背景，自己第二次尝试vue-cli3脚手架工具。按照文档步骤。定义了env.test test模式

在打包的时候通过mode 去区分

test: vue-cli-service build --mode test
build: vue-cli-service build --mode production

执行 npm run test 得到了预期之外的问题

所有的js文件并没有放进 js 文件夹底下 全都跑出来了

寻找原因

1. 首先我在 npm run test 去打印了 process.env.NODE_ENV 输出test是没错的，确定了环境改变了
2. 既然输出的格式变了 那肯定就是 output 配置出问题了
   执行了 vue inspect > test.config.js --mode test 经过对比发现配置变化了

原本filename的配置应该是

output: {
    path: 'xxxx',
    filename: 'js/[name].[contenthash:8].js',
    publicPath: '/spreadshare-console',
    chunkFilename: 'js/[name].[contenthash:8].js'
  }

不太清楚是什么原因造成的。
按照我的理解cli3中的mode是在构建命令中加入的用来区分 模式、环境的
我又尝试了将production的NODE_ENV修改成了test 执行 npm run build 原本以为通过原有的product模式去打包。并不行。哈哈 是我想多了。我这里改了内部还是会判断是不是production
不知道大家有没有碰到这个问题。可以讨论一下。

Answer 1

可以把模式的名称改下试试，test可能内部用了。

大概看了下源码，好像是mode不能使用test

实测可以这样：

根目录建.env.testing

NODE_ENV = testing

// package.json

"test": "vue-cli-service build --mode testing"

效果