javascript - 条件环境变量 tree-shaking

Question

目前我正在尝试根据环境变量删除未使用的代码。在下面的代码中，当我运行ng build --prod并设置evironment.showDevTools = false时，environment.prod.ts我希望它console.log不会包含在最终的构建文件中，但不幸的是它是。我究竟做错了什么？

import { Component } from '@angular/core';
import { environment } from '../environments/environment';

if (environment.showDevTools) {
  console.log('showing dev-tools');
}

@Component({
  selector: 'app-component',
  templateUrl: './app.html',
  styleUrls: ['app.scss']
})
export class AppComponent {

}

main.js 的一部分

,ut=n("AytR");ut.a.showDevTools&&console.log("showing dev-tools");var st=function(){

Answer 1

我必须添加一个名为"sideEffects": false. package.json所以它目前看起来像这样：

{
  "name": "myApp",
  "version": "1.0.0",
  "sideEffects": false,
  "scripts": {
    "ng": "ng",
    "test": "ng test",
    ...
  },
}

参考：https://webpack.js.org/guides/tree-shaking/ , https://github.com/stereobooster/package.json#sideeffects