vue多环境配置

package.json配置

  "scripts": {
    "dev": "vue-cli-service serve",
    "build:prod": "vue-cli-service build --mode production",
    "build:tian": "vue-cli-service build --mode tian",
    "preview": "node build/index.js --preview",
    "lint": "eslint --ext .js,.vue src"
  },

配置文件名字

• 必须以.env开头，后面随意，production、development 是框架缺省值，在运行npm run dev 会自动加载.env.development配置文件，所以不用写 --mode，运行npm run build 时会自动加载 .env.production 配置文件，也可以不写 --mode production
• 除了production、development，其他的也可以自定义，注意自定义配置文件build之后如果没有配置文件顶部没有写NODE_ENV = production，那么就不会拆打包如图

生产环境需要拆分打包+随机字符后缀，避免浏览器缓存

如下图没有拆分和随机字符，就会导致浏览器缓存0.js，实测就算是强制刷新也可能没用(ctrl+F5)

在配置文件头部配置NODE_ENV = production 就可以拆分打包了

多环境配置文件结构、文件命名展示