angular2/4 – 提前编译如何

我试图引导我的Angular 2 RC5应用程序遵循本指南https://angular.io/docs/ts/latest/guide/ngmodule.html下面是我的代码

import { AppModuleNgFactory } from './app.module.ngfactory'; import {platformBrowser} from "@angular/platform-browser"; platformBrowser().bootstrapModuleFactory(AppModuleNgFactory); 

但是，当我试图编译打字稿的代码，我得到了以下错误

app \ main.ts（1,36）：错误TS2307：找不到模块'./app.module.ngfactory'。

我怎样才能生成app.module.ngfactory文件？ 我应该使用哪个工具？

Answer 1

JIT和AOT编译器都从相同的AppModule源代码生成一个AppModuleNgFactory类。

JIT编译器在运行中，在内存中，在浏览器中创build工厂类。 AOT编译器将工厂输出到我们在main.ts的静态版本中导入的物理文件中

在较高的层面上， @angular/compiler-cli提供了Typescript的tsc编译器的包装，并且AoT都编译你的应用程序的代码，然后将应用程序的Typescript转换为Javascript：

 $ ngc -p src 

这将为每个组件和模块（称为NgFactory ）生成一个新文件，

要在AoT模式下运行您的应用程序 ，所需要的只是从中更改您的main.ts文件

 import {platformBrowserDynamic} from '@angular/platform-browser-dynamic' import {MyAppModule} from './app' platformBrowserDynamic().bootstrapModule(MyAppModule); 

至

 import {platformBrowser} from '@angular/platform-browser' import {MyAppModuleNgFactory} from './app.ngfactory' //generated code platformBrowser().bootstrapModuleFactory(MyAppModuleNgFactory); 

---

编辑：

要使用ngc命令，首先安装这些 –

 $ npm install @angular/compiler-cli typescript@next @angular/platform-server @angular/compiler 

ngc是tsc替代品，您可以在./node_modules/.bin/ngc文件夹中find它。

Answer 2

2017年更新

截至2017年1月如果使用angular-cli ，则在运行以下命令时，AOT编译现在是缺省的编译方法。

如果你想禁用AOT，而是在生产中使用JIT，那么你可以使用ng build --prod --no-aot 。

来源： https ： //github.com/angular/angular-cli/issues/4138

---

这意味着你仍然可以在开发时使用JIT编译（使用ng build编译得更快），并将你的.ts作为如下所示：

 // The browser platform with a compiler import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; // The app module import { AppModule } from './app/app.module'; // Compile and launch the module platformBrowserDynamic().bootstrapModule(AppModule); 

---

总结：

 ng build // build with JIT ng build --prod --no-aot // build with JIT ng build --prod // build with AOT