3

简洁版本:

angular2(当前为 2.2.1)是否按照快速入门使用 systemJS 与提前编译的延迟加载模块一起工作?

更长的版本:

我对 angular2 相当陌生,并且一直在关注 angular.io 上的快速入门和其他文档,以创建一个包含一些组件的简单站点,这些组件被分离成通过路由延迟加载的模块。

所以跟随这里:https ://angular.io/docs/ts/latest/cookbook/aot-compiler.html

我已经按照所有说明进行操作,我在 aot 文件夹中使用“node_modules/.bin/ngc”-p tsconfig-aot.json' 命令得到了输出,并且我在其中有一个“build.js”文件运行 '"node_modules/.bin/rollup" -c rollup-config.js' 命令后我的 dist 文件夹。

我已经设置了我的 index.html 删除 system.js 并引用了我的 build.js 输出。

我最初的运行失败了,抱怨它不知道“系统”是什么。我认为在构建过程中,我不再需要 system.js,所以不确定那里发生了什么。

如果我包含 system.js 并再次运行,我的错误中会出现以下堆栈跟踪:

加载资源失败:服务器响应状态为 404(未找到)build.js:3 异常:未捕获(承诺中):错误:(SystemJS)XHR 错误(404 未找到)正在加载http://localhost:3000 /app/shell/layout.module.ngfactory 错误:XHR 错误 (404 Not Found) 在 XMLHttpRequest.wrapFn [as _onreadystatechange] ( http://加载http://localhost:3000/app/shell/layout.module.ngfactory localhost:3000/node_modules/zone.js/dist/zone.js:698:29 ) 在 ZoneDelegate.invokeTask ( http://localhost:3000/node_modules/zone.js/dist/zone.js:265:35 ) 在Object.onInvokeTask ( http://localhost:3000/dist/build.js:4:15086 ) 在 ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:264:40)在 Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:154 :47 ) 在 XMLHttpRequest.ZoneTask.invoke ( http://localhost:3000/node_modules/zone.js/dist/zone.js:335:33 ) 加载http://localhost:3000/app/shell/layout 时出错。 module.ngfactory (SystemJS) XHR error (404 Not Found) loading http://localhost:3000/app/shell/layout.module.ngfactory Error: XHR error (404 Not Found) loading http://localhost:3000/app /shell/layout.module.ngfactory 在 XMLHttpRequest.wrapFn [as _onreadystatechange] ( http://localhost:3000/node_modules/zone.js/dist/zone.js:698:29) 在 ZoneDelegate.invokeTask ( http://localhost:3000/node_modules/zone.js/dist/zone.js:265:35 ) 在 Object.onInvokeTask ( http://localhost:3000/dist/build.js:4 :15086 ) 在 ZoneDelegate.invokeTask ( http://localhost:3000/node_modules/zone.js/dist/zone.js:264:40 ) 在 Zone.runTask ( http://localhost:3000/node_modules/zone.js /dist/zone.js:154:47 ) 在 XMLHttpRequest.ZoneTask.invoke ( http://localhost:3000/node_modules/zone.js/dist/zone.js:335:33 ) 加载http://localhost 时出错: 3000/app/shell/layout.module.ngfactory

奇怪的是它正在尝试加载“ http://localhost:3000/app/shell/layout.module.ngfactory ”,这是我懒加载的模块之一。

AOT 是否不适用于延迟加载的模块?

4

2 回答 2

3

我认为问题不在于 AOT,但该汇总不适用于延迟加载的模块,因为汇总不支持代码拆分(但是,有一个未解决的问题)。因此,由于汇总只能生成单个输出文件,因此没有延迟加载的概念 - 一切都已加载!

于 2016-11-23T09:38:47.907 回答
0

是的。带有 loadChildren 的 Angular2 快速入门在 AOT 中无法正常工作。你可以在 JiT 中开发,等待 angular、rollup 的升级。或者你可以使用 webpack 代替 rollup。Angular-cli 现在支持 AOT 和延迟加载。你可以试试https://github.com/angular/angular-cli/

于 2017-01-12T17:34:46.017 回答