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