Question

我有一个模块（MyCommonModule），其中包含我计划在不同角度应用程序之间共享的通用组件，服务等。

这是一个简单应用的示例，只导入MyCommonModule（但尚未引用AppComponent中的任何内容）：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { MyCommonModule } from "../common";

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        MyCommonModule.forRoot()
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

MyCommonModule的定义如下：

import { NgModule, ModuleWithProviders } from '@angular/core';
import { CommonModule } from '@angular/common';

// Components
import { SomeComponent } from "./components/some.component";
export * from "./components/some.component";

// Directives
import { SomeDirective } from "./directives/some.directive";
export * from "./directives/some.directive";

// Services
import { SomeService } from "./services/some.service";
export * from "./services/some.service";

// Models
export * from "./models/some.model";

@NgModule({
    imports: [
        CommonModule
    ],
    declarations: [
        SomeComponent,
        SomeDirective
    ],
    providers: [],
    exports: [
        SomeComponent,
        SomeDirective
    ]
})
export class MyCommonModule {
    public static forRoot(): ModuleWithProviders {
        return {
            ngModule: MyCommonModule,
            providers: [
                SomeService
            ]
        };
    }
}

当我运行ng build --environment=prod --target=production时，我得到一个AOT的构建：d。如果我使用source-map-explorer分析输出，我可以看到生成的main.*.bundle.js和vendor.*.bundle.js包含MyCommonModule中的所有服务和组件（及其引用），即使我没有在我的应用程序中使用任何一个。

这是预期的行为吗？是否已为角度cli应用程序启用树摇动？

Answer 1

＆＃34;树摇杆＆＃34;从上到下遍历依赖图，并在树中抖动未使用的代码，如枯叶。如果您的AppModule导入了MyCommonModule＆＃34;树振动器＆＃34;无法知道您是否真正使用它（就使用该代码的JavaScript而言）

Answer 2

另外，一旦解决了问题，请尝试以下方法：

ng build -prod --build-optimizer=true

（暂无法添加评论，但这可能会有所帮助）

Angular AOT编译应用程序没有像预期的那样摇晃树

2 个答案: