开发和生产的不同浏览器列表？

Question

我只想在生产版本中激活 Differential Loading。原因是我不希望开发构建花费太长时间。

由于差异加载来自浏览器列表内容，我想为每个构建配置不同的浏览器列表。

这是开发人员的浏览器列表：

> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11

这是产品：

> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11

我使用这些命令激活我的开发和生产版本：

开发人员：ng build

产品：ng build --prod

相当标准。

Answer 1

如果我理解正确，那么更改 angular.json 中的构建配置应该可以解决问题。您可以只复制 Angular 默认情况下对 environment.ts 文件所做的操作。

因此，在 angular.json 中的 build.configurations.production 下，您可以添加到 fileReplacements 数组：

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

这些文件名是假设的，但您显然可以用任何您需要的名称来替换。

编辑

我不完全确定这是否有效或如何测试它。根据浏览器列表文档，您还可以使用环境标志 https://github.com/browserslist/browserslist#configuring-for-different-environments

对于 Angular 这看起来是这样的：

[development]
> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11

[production]
> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11

这应该可以使用 NODE_ENV，当使用 ng serve（以及 ng build）和 [=21= 时，Angular 设置为 development ] 使用 ng build --prod

时

开发和生产的不同浏览器列表？

Different browserlist for dev and prod?

angular

angular-cli