多个开发部署环境，不想更改配置文件，怎么办?

一般开发一个软件会存在多个环境，例如基本的development，test，production。每个环境的配置可能都不样，就存在这些问题:

1.每次都要去更改配置，不利于自动化部署

2.存在改错配置的可能。

这篇文章，就来解决这个问题。

在创建完.net core应用时，一般会生成两个配置文件，appsettings.json和appsettings.development.json。我们可以在visual studio调试，可以在工具栏选择启动的方式，如图

这个文件的配置呢，对应的就是Properties下的launchSettings.json文件，这里面有个参数ASPNETCORE_ENVIRONMENT就是环境的配置变量。我们可以在里面加一个Test(测试环境)的配置，然后再新增一个appsettings.Test.json的配置文件。

我们将它们的启动端口设置的不一样，来验证是不是选择不同的启动方式，端口是不是不一样。

我们先启动mozhi.smartinvent.Demo.development

然后再启动mozhi.smartinvent.Demo.test

是不是，development对应的是44000端口，test对应的是44010端口。对，就是这么简单。但是要记住，一般我们不会把production环境的配置放到这里，因为不安全，万一泄露了一些数据库账号密码之类的信息，那可就麻烦。

但是这是调试，那么如果我们在实际部署时，没有一个启动配置给我们选，怎么办？环境变量这个事就起作用了。我们可以在系统环境变量中定义个ASPNETCORE_ENVIRONMENT变量，在cmd窗口中执行

setx ASPNETCORE_ENVIRONMENT Development /M  #一定用管理员账号执行  /M表示永久使用，不然重启电脑会消失

我们打开系统的环境变量，就可以找到这个变量了

然后我们到程序的debug下直接运行mozhi.smartinvent.Demo.exe来模拟部署到服务器。可以看到环境变量取得是development。

我们在执行setx命令，更改环境变量值。

setx ASPNETCORE_ENVIRONMENT Test /M

再启动mozhi.smartinvent.Demo.exe，可以看到现在取得是Test的配置信息。

但是如果.net core 应用是部署在IIS上的话，这种方式就不起作用了，必须要在web.config文件中增加配置

<configuration>
  <system.webServer>
    <handlers>
      <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModule" resourceType="Unspecified"/>
    </handlers>
    <aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="true" stdoutLogFile=".\logs\stdout" forwardWindowsAuthToken="false">
      <environmentVariables>
        <environmentVariable name="ASPNETCORE_ENVIRONMENT" value="Development" />
      </environmentVariables>
    </aspNetCore>
  </system.webServer>
</configuration>

好了，.net core的多环境配置就这些了。后面再k8s部署时我们也会用到这个。下面我们来讲一下vue的多环境配置。

在vue根目录下新建以下几个文件,注意一定要以“.”开头，主要是用来配置访问后端api的地址。

.env.development

# 开发环境
NODE_ENV = 'development'

# 开发环境，默认BASEURL(api请求地址)
VUE_APP_BASE_URL = '/sm'

# 开发环境，API前缀
VUE_APP_BASE_API = '/sm'

#开发环境，Url地址
VUE_APP_BASE_TARGET = 'http://localhost:44000'

.env.test

# 测试环境
NODE_ENV = 'test'

# 测试环境，默认BASEURL
VUE_APP_BASE_URL = '/api/test'

# 测试环境，API前缀
VUE_APP_BASE_API = '/test'

# 测试环境，Url地址
VUE_APP_BASE_TARGET = 'http://localhost:44010/'

.env.production

# 正式环境
NODE_ENV = 'production'

# 生产环境，默认BASEURL
VUE_APP_BASE_URL = '/sw'

# 生产环境，API前缀
VUE_APP_BASE_API = '/sw'

#生产环境，Url地址
VUE_APP_BASE_TARGET = 'http://gateway.mozhi.com'

更改package.json文件，将scripts部分改成如下:

"scripts": {
    "dev": "vue-cli-service serve --mode development",
    "prod": "vue-cli-service serve --mode production",
    "test":"vue-cli-service serve --mode test",
    "build": "vue-cli-service build --mode production",
    "lint": "vue-cli-service lint"
  }

vue.config.js文件更改成

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave:false,
  devServer: {
    proxy: {
      [process.env.VUE_APP_BASE_API]: {
        target: process.env.VUE_APP_BASE_TARGET,
        pathRewrite:{['^' + process.env.VUE_APP_BASE_API]:''},//路径改写
        changeOrigin: true
      },
    }
  }
})

运行进行依赖包安装

npm install

分别运行npm run dev ， npm run test 查看访问的后台地址

好了，.net core 和 vue的多环境配置就到这里了。

如果你觉得我的文章还不错，请关注，转发和评论