如何在 Angulrar Schematics 中添加包依赖（官方）

Question

任务是扩展 ng-new 原理图并添加一些依赖项，如 @angular/material 和 Lumberjack 等

我发现一篇文章，其中作者建议使用包“@schematics/angular/utility/dependencies”中提供的一些实用程序。我试过了，它工作正常。下面是代码：

function addLibrary(_options: any): Rule {
  return (_tree: Tree, _context: SchematicContext) => {
   
    const dep: NodeDependency = {
      type: NodeDependencyType.Dev,
      name: '@angular/material',
      version: '11.2.8',
      overwrite: true,
    };
    addPackageJsonDependency(_, dep);
    const installTaskId = _context.addTask(new NodePackageInstallTask(), []);
    return _tree


  };
}

然而，在同一篇文章中，作者警告说

The helper functions I present you in this article are neither documented nor officially supported, and they may change in the future

所以我的问题是，在angular schematics 中是否有任何官方可靠的方法来添加包依赖项？特别是在扩展 ng-new 原理图时？

Answer 1

我会说您可以安全地使用该函数，因为 Angular 在其所有内部包中内部使用该函数。

Angular CLI 包有很多这样的功能，很难记录每个功能（个人意见），但这并不意味着你不能使用它。

但是无论出于何种原因，如果您不想使用该函数，那么您可以编写自己的函数，使用 Tree.

修改 package.json 文件

function addPackageToPackageJson(host: Tree, pkg: string, version: string): Tree {
  if (host.exists("package.json")) {
    const sourceText = host.read("package.json")!.toString("utf-8");
    const json = JSON.parse(sourceText) as PackageJson;
    if (!json.dependencies) {
      json.dependencies = {};
    }
    if (!json.dependencies[pkg]) {
      json.dependencies[pkg] = version;
      json.dependencies = sortObjectByKeys(json.dependencies);
    }
    host.overwrite("package.json", JSON.stringify(json, null, 2));
  }
  return host;
}

使用 JSON 格式的树读取 package.json 文件内容。
在你想要的任何依赖项中添加你的包和版本。
使用主机覆盖功能写入内容。

参考：- https://github.com/angular/components/blob/HEAD/src/cdk/schematics/ng-add/package-config.ts#L24

如何在 Angulrar Schematics 中添加包依赖（官方）

How to add package dependency in Angulrar Schematics(officially)

angular

angular-schematics