Angular CLI - ng build

时间:2017-06-20 18:12:12

标签: angular typescript angular-cli angular2-aot

我使用Angular CLI创建了一个应用程序,它可以与JIT编译一起使用。我觉得我需要更快地使我的应用程序,所以我计划将应用程序从JIT转换为AOT。

我按照angular.io

提到的说明进行操作

https://angular.io/guide/aot-compiler

本文档。

我成功转换了一些步骤,帮助我们将所有文件转换为ngFactory,完成了汇总过程而没有错误。

执行ng build --aot

时出错

错误消息如下

  

试图找到引导代码,但不能。静态指定   可分析的引导代码或将entryModule传递给插件   选项。错误:试图找到引导程序代码,但不能。指定   要么是静态可分析的引导代码,要么是传入entryModule   到插件选项。       at Object.resolveEntryModuleFromMain(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@ngtools/webpack/src/entry_resolver.js:128:11)       在AotPlugin._setupOptions(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@ngtools/webpack/src/plugin.js:143:50)       在新的AotPlugin(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@ngtools/webpack/src/plugin.js:26:14)       at _createAotPlugin(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@angular/cli/models/webpack-configs/typescript.js:55:12)       at Object.exports.getAotConfig(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@angular/cli/models/webpack-configs/typescript.js:88:19)       在NgCliWebpackConfig.buildConfig(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@angular/cli/models/webpack-config.js:26:37)       在Class.run(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@angular/cli/tasks/build.js:27:92)       在Class.run(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@angular/cli/commands/build.js:149:26)       在Class.Command.validateAndRun(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@angular/cli/ember-cli/lib/models/command.js:128:15)       at /Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/@angular/cli/ember-cli/lib/cli/cli.js:92:22       在tryCatch(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/rsvp/dist/rsvp.js:539:12)       at invokeCallback(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/rsvp/dist/rsvp.js:554:13)       at /Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/rsvp/dist/rsvp.js:629:16       在同花顺(/Users/wakdev/WebstormProjects/wak_ang2_angcli/node_modules/rsvp/dist/rsvp.js:2414:5)       at _combinedTickCallback(internal / process / next_tick.js:67:7)       at process._tickCallback(internal / process / next_tick.js:98:9)

这是我的main.ts

import { platformBrowser }    from '@angular/platform-browser';
import {AppModuleNgFactory} from '../aot/src/app/app.module.ngfactory';

console.log('Running AOT compiled');
//platformServer().bootstrapModuleFactory(AppModuleNgFactory);
platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);

我的tsconfig-aot.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true,
    "typeRoots": [
      "./node_modules/@types/"
    ]
  },

  "files": [
    "src/app/app.module.ts",
    "src/main.ts",
  ],

  "angularCompilerOptions": {
    "genDir": "aot",
    "skipMetadataEmit" : true
  }
}

有没有人有同样的问题

1 个答案:

答案 0 :(得分:2)

正如评论中所提到的,如果你正在使用cli,那么运行ng build --prod应该为你构建,aot和tree shake。如果你想要做更多的手动路线,就像你上面所做的那样,你需要在你的angularCompileOptions添加另一行,这样它们看起来像这样:

  "angularCompilerOptions": {
    "genDir": "aot",
    "entryModule": "app/app.module#AppModule",
    "skipMetadataEmit" : true
  }

由于您没有显示您的实际模块,您可能必须更新路径和模块名称,但该属性很可能是您缺少的。