多环境变量

我们在开发的时候 通常需要去操作三个服务器去确保我们开发的质量，开发环境为一个服务器。测试一个服务器，上线时又需要一个服务器。 多环境变量问题就是为了解决这个问题的。

1.首先我们需要在package.json文件中的script设置三个属性

"scripts": {
    "serve": "vue-cli-service serve", // 开发环境
    "build": "vue-cli-service build", // 生产环境
    "test": "vue-cli-service build --mode testing" // 测试环境
  },
前两者一般都是默认的 我们只需要添加一个TEXT即可

这样我们就可以通过不同的启动方式去启动我们不懂的服务器了

2.需要我们在根目录中创建三个本地配置文件

1. .env.development // 开发环境
2. .env.production // 生产环境
3. env.testing // 测试环境

接这在三个文件中写入

NODE_ENV = “development” ----------- 开发环境配置
NODE_ENV = “production” ---------------生产环境配置
NODE_ENV = “testing” -------------------- 测试环境配置

3.我们需要在根目录中手动创建一个config文件，里面专门用来保护我们的环境变量

我们需要创建三个响应的环境配置的JS

再从中导出BASEURL

列：

module.exports = { baseUrl:"http://www.development.com" } // 开发环境

然后通过在创建一个INDEX.JS中引入之后再次导出，也就是说我们需要再config文件中创建4个JS

const config = require("./env." + process.env.NODE_ENV); // process.env.NODE_ENV 我们使用哪个方式运行，就会引入相应的baseUrl module.exports = config; // 最后导出

注意！如果是再测试环境，需要再多配置一个JS文件

4.我们需要再根目录创建的VUE.CONFIG.JS中给

module.exports = { publicPath: "./" // 路径都换为 ./ };就可以去运行我们不同的环境拉