5

我正在使用一个非常简单的 Angular 2 应用程序，并且我没有使用 Angular CLI（为了这个特定的问题，请不要建议我使用 CLI）。使用 JIT 编译器时，站点运行没有任何问题。急切加载的模块和延迟加载的模块都很好。

我可以成功运行 AOT 编译器，然后使用 Rollup 执行摇树，如Angular 2 文档中所述。执行此操作时，站点运行时对于急切加载的模块没有任何问题，但是在尝试转到急切加载的模块时出现错误。这是错误消息：（GET http://atticus.local/app/contacts/contacts.module.ngfactory 404 (Not Found)这是我试图延迟加载的模块）

一个非常基本的问题开始：

  • 在进行 AOT 和摇树时使用延迟加载是否有意义？你还有福利吗？

假设上述问题的答案是肯定的，我想知道如何让 AOT 编译和延迟加载一起工作？我在 Angular CLI 的 GitHub 问题上看到有人提出了这个问题，而且看起来有一些解决方案已经到位。这假设您使用的是 CLI，而我不是。我在运行 AOT 时的输出中确实注意到，没有为我的延迟加载模块创建*.ngfactory.ts也没有*.ngsummary.json创建，而只是为我急切加载的模块创建。这可能是有道理的？

作为参考，我为 AOT 运行的命令ngc -p tsconfig-aot.json如下tsconfig-aot.json

{
    "compilerOptions": {
        "target": "es5",
        "module": "es2015",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "lib": [
            "es2015",
            "dom"
        ],
        "noImplicitAny": true,
        "suppressImplicitAnyIndexErrors": true,
        "typeRoots": [
            "node_modules/@types/"
        ]
    },
    "files": [
        "app/app.module.ts",
        "app/main-aot.ts"
    ],
    "angularCompilerOptions": {
        "genDir": "aot",
        "skipMetadataEmit": true
    }
}

然后我跑去rollup -c rollup-config.js汇总执行摇树。这是rollup-config.js：

import rollup from 'rollup'
import nodeResolve from 'rollup-plugin-node-resolve'
import commonjs from 'rollup-plugin-commonjs';
import uglify from 'rollup-plugin-uglify'

//paths are relative to the execution path
export default {
    entry: 'app/main-aot.js',
    dest: 'aot/dist/build.js', // output a single application bundle
    sourceMap: true,
    sourceMapFile: 'aot/dist/build.js.map',
    format: 'iife',
    plugins: [
        nodeResolve({ jsnext: true, module: true }),
        commonjs({
            include: ['node_modules/rxjs/**']
        }),
        uglify()
    ]
}

请让我知道我是否可以提供更多信息或更清楚。谢谢！

4

1 回答 1

2

rollup 还不支持代码拆分。这是一个github问题。

您可以使用 webpack 来实现这一点。它支持代码拆分和延迟加载和 Treeshaking。

在进行 AOT 和摇树时使用延迟加载是否有意义？你还有福利吗？

为什么不？您仍然可以减少应用程序的启动时间，因为只需加​​载第一个模块。但是，您可以使用正确的 Preloadingstrategy 自动加载其他的。

法比安

于 2017-03-14T07:28:59.437 回答