Angular 4如何在非生产环境启用生产级构建优化

我刚好碰到过类似的场景，其实核心是要让Angular CLI把你的testserver环境识别为“生产环境”，这样就能自动启用那些-prod参数带来的优化了，具体可以这么做：

方法一：修改angular-cli.json配置（推荐） #

Angular 4使用的是旧版CLI，配置文件是angular-cli.json。你需要在文件里的两个地方做修改：

1. 首先确保environments节点已经正确注册了你的testserver环境：

"environments": {
  "dev": "environments/environment.ts",
  "prod": "environments/environment.prod.ts",
  "testserver": "environments/environment.testserver.ts"
},
"environmentSource": "environments/environment.ts"

2. 然后找到apps节点下对应你的应用，在environments子节点里给testserver添加production: true的标记：

"apps": [
  {
    // 其他应用配置（比如name、root等）
    "environments": {
      "dev": {
        "production": false
      },
      "prod": {
        "production": true
      },
      "testserver": {
        "production": true  // 关键：把这个环境标记为生产环境
      }
    }
  }
]

修改完成后，直接执行原来的命令即可：

ng build --environment=testserver

这样CLI会自动启用AOT编译、代码压缩、Tree Shaking等所有生产级优化，同时使用你自定义的environment.testserver.ts文件。

方法二：命令行手动指定优化参数（不推荐，参数繁琐） #

如果你不想修改配置文件，也可以在命令里手动添加所有生产级优化的参数，绕过-prod的环境强制切换：

ng build --environment=testserver --optimization=true --aot=true --build-optimizer=true --minifyjs=true --minifycss=true --extractcss=true --named-chunks=false --vendor-chunk=false

不过这种方式参数太多，容易遗漏，而且每次构建都要输入，不如修改配置文件来得方便。

补充说明 #

Angular CLI里的-prod参数本质是一个快捷组合：它不仅会切换到prod环境，还会自动设置一系列优化标志（比如production: true）。所以只要把自定义环境标记为production: true，就能享受同样的优化效果，同时保留自定义的环境配置。

内容的提问来源于stack exchange，提问作者dshockey