angular6 + ng-zorro鹿途后台管理系统（三）环境变量配置

为什么要配置多个环境变量？因为在实际的开发中，可能存在开发、测试或者正式多个环境变量，我们希望以一种输入不同的参数来切换不同环境的工作模式，所以需要配置多个环境变量。

环境变量配置在environments文件下，默认情况下存在environment.prod.ts和environment.ts两个文件，environment.prod.ts文件中的参数production是true，environment.ts文件中的参数

production是false,这个参数就是来区分是否为生产环境。

鹿途系统希望新增一个本地开发环境，我们就在environments中新增一个本地环境变量，也就是新增一个environment.local.ts文件,推荐的命名的规则是environment + (本地、测试、生产)，比如我们想新增一个demo环境，我们就在environments中新增一个environment.demo.ts。

环境变量配置完成后，我们接下来就要实现，输入不同的参数来切换不同的工作环境；我们在angular.json文件（projects/项目名/architect/configurations)下新增配置，如下鹿途为local变量新增的配置

 "local": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.local.ts"
                }
              ]
            }　　

接下里我们在（architect/serve/configurations)新增如下配置

 "local": {
              "browserTarget": "productShipment:build:local"
            }

以上两步完成后我就可以通过输入不同的参数来切换不同的工作环境，命令如下：

ng s -c local/prod

 

angular6之前环境变量配置方法：https://www.cnblogs.com/zry2510/p/9239551.html

 

 

项目github地址：https://github.com/ZhouRenYou/ng-deerway
项目预览地址（非实时更新）：https://zhourenyou.github.io/web-deerway/passport/login