5

我正在创建一些自定义原理图，这将帮助我们快速启动 Angular 库项目。鉴于此，我不希望开发人员必须有一个ng ...他们必须运行的命令清单才能启动和运行库，我只想有一个命令来设置工作区，将库放入其中，进行一些自定义（以开玩笑的方式交换业力，添加一些 CI 配置等）。

我这样做的方法是创建一个从空树开始的原理图，然后ng-new从 调用原理图@schematics/angular，通过externalSchematic()链接library来自同一个包的原理图，然后是我们的一些自定义原理图以进行自定义。

我想要使​​用externalSchematic()而不是将所有外部原理图的代码复制到我的原理图项目中的原因是，当@schematics/angular更新时，我可以yarn upgrade-interactive通过运行测试套件来查找和解决任何问题来合并这些更新。最终，我们可以使用 CI 将其自动化。

我在这里创建了一个小的自包含示例来重现我的错误：https ://github.com/matt328/ng-schematics-test

重现步骤：

git clone
npm install
npm run build
schematics ng-schematics-test:my-full-schematic --name=test-schematic

当我运行原理图时，它会报告Invalid source: undefined.

这里

https://github.com/matt328/ng-schematics-test/blob/master/src/my-full-schematic/index.ts#L30

是我externalSchematic()用来打电话的地方ng-new。

我已经对源代码进行了一些挖掘，发现它是由一些角度示意图引起的

"$default": {
  "$source": "projectName"
}

在他们的模式中。该错误是projectName未定义的结果。

为了能够与 通话ng-new，还需要做externalSchema()什么？这种方法有效吗，还是有其他方法可以做到这一点？

4

2 回答 2

2

早在 2 月初，我就能够externalSchematics从这个演示工作中获得该命令的工作版本。当我今天尝试复制以前的结果时，我收到了与您相同的错误（对于ng-new, component，以及interface当我尝试从原理图项目中运行命令时。

但是，当我创建了一个新的 Angular 项目并创建了一个指向原理图项目的符号链接时，我能够在 Angular 项目中成功生成一个component和interface。尚未成功，ng-new因为node_modules映射不是那么简单（它确实提示我输入一些必需的参数，version并且name在引发缺少模块错误之前，我认为这可能被解释为进度）。

于 2018-06-02T06:43:56.713 回答
1

这个花了我一段时间：

似乎您必须运行任何在真实角度项目中扩展@schematics/angular原理图的原理图。为此，请执行以下操作：

  • $ cd <path to an angular project>
  • $ npm link <path to your custom schematics project>
  • $ ng g <schematics-collection-name>:<schematic-name> [params]

这应该可以工作，因为您扩展的 @schemics/angular 原理图现在在 angular 项目中运行并且能够获得正确的来源。

另请注意：运行它$ schematics <collection-name>:<schematics-name>会导致相同的未定义错误！

希望这可以帮助

于 2018-06-19T08:25:32.680 回答