Javascript 角4特征模块

我们是否可以在单独的项目中开发一个angular 4功能模块，并与根模块建立链接以作为延迟加载

如果是这样，loadChildren属性的路由url是什么；博士 遵循指南，查看官方角度模块，如

HttpModule

长话短说 这是可能的，但我还没有找到任何关于它的官方文档或教程。基本上，您需要做的是创建一个可以包含在项目中的库。与官方的

RouterModule

或

HttpModule

类似

您基本上必须创建一个模块，导出所有公共内容，如指令、服务和组件，然后最终构建整个功能模块

构建模块并不是那么简单。在

HttpModule

中，他们使用ngc来编译类型脚本ngc是官方的角度编译器。之后，他们使用rollup js和minify js对代码进行打包和缩小

因此（对于最基本的库），您需要的依赖项是

@angular/core

，

@angular/compiler

，

@angular/compiler cli

，

rollup

，

rxjs

，

typescript

和

zone.js

您还必须修改

tsconfig.json

。 这些是主要的变化（我在最后提供的第二个链接列出了更多提高性能的变化）：

• 为提前（AoT）编译添加以下行：

  “angularCompilerOptions”：{“strictMetadataEmit”：true}

• 设置

  “声明”：true

  ，这将使编译器创建定义文件（您知道

  某些文件.d.ts

  内容）
• 使用指向其他模块的显式路径也很重要。这是因为，如果在示例中在构建中包含Angular模块，应用程序将崩溃，因为Angular将出现两次
• 同时设置

  “模块”：“es2015”

现在需要如下配置

rollup.config.js

：

• entry

  应该是传输的

  index.ts的路径

• dest

  应该是

  bundles/modulename.umd.js

  ，这是模块的角度标准名称（

  .umd.js

  是角度模块的标准格式）

• moduleName

  将是一个JavaScript对象，因此没有特殊字符（也没有破折号）
• 最后，您必须定义globals，您知道您使用的模块，但自己编写的不是

  @angular/core

  ，因此

  globals

  应该是这样的对象：

  {@angular/core:“ng.core”}

查看Angular的

rollup.config.js

，了解

HttpModule？

：

然后设置

package.json

以发布模块。重要的是你：

• 设置

  “版本”

  （记住使用）
• 添加您的

  “对等依赖项”

• 将

  “main”

  设置为

  .umd.js

  文件的路径
• 将

  “module

  ”设置为传输的

  index.js

  文件

现在，您可以构建功能模块，然后将其作为依赖项添加到其他项目中，并在那里使用您的awsome工具

两篇关于进一步信息的好帖子（尽管第二篇不容易理解）：

说明如何创建（共享）模块

更多关于发布模块的小细节。

在YouTube上发布，这将帮助您实现这一目标。 它涵盖了从头开始的配置，没有大量的依赖项和样板代码