vue之打包配置环境

一直以来都是用脚手架直接搭建的项目,也很少去深究,前两天因为环境配置变更,稍微研究了下

NODE_ENV

首先 在evn.xxx 的配置文件里 一定要有的NODE_ENV
NODE_ENV 默认只有两种状态即development和production

development: 指代本地开发即localhost环境（本地的开发）。
production: 代表发布在任何服务上的服务（不管是预生产还是生产环境）。
node: 是不知道你服务是测试还是正式，除非你手动指定。

除了 NODE_ENV 以外的属性,属性名必须以VUE_APP_开头，比如VUE_APP_XXX

packjson.js

在packjson里

 "scripts": {
    "serve": "vue-cli-service serve", // 默认调用 env.dev
    "build": "vue-cli-service build", // env.production
    "lint": "vue-cli-service lint" // 校验检查
  },

vue-cli-service：这个命令用于构建项目，生成可用于本地环境的代码。它会经过压缩、优化，并生成本地环境需要的文件。

vue-cli-service build：这个命令用于构建项目，生成可用于生产环境的代码。它会经过压缩、优化，并生成生产环境需要的文件。

vue-cli-service lint：这个命令用于检查项目中的代码质量问题，比如代码格式、代码错误、潜在的问题等。它会使用ESLint工具进行检查，如果检查到问题，它会在控制台报告。

自定义新的打包配置

在packjson.js里使用 —mode 重新定义打包的配置文件
保证evn.xxxh 这个一定要和packjson.js 里的 --mode xxxh 对应上
而serve:xxxh 一定要和运行命令的 npm run serve:xxxh 对上
使用如下
.evn.xxxh

NODE_ENV=develpoment
VUE_APP_BASE_URL="http://102.21.21.21:xxxx"

packjson里

 "scripts": {
    "serve": "vue-cli-service serve", // 默认调用 env.dev
    "serve:xxxh": "vue-cli-service serve --mode xxxh", // 默认调用 env.dev
    "build": "vue-cli-service build", // env.production
    "lint": "vue-cli-service lint" // 校验检查
  },

运行打包命令

 npm run serve:xxxh