将 Angular 材料添加到 Nx 工作区

Question

我想将 angular-material 添加到我的 nx-workspace。

angular 材料文档 ( https://material.angular.io/guide/getting-started ) 说我应该运行ng add @angular/material 。

我已经在我的 nx 工作区的根目录中尝试过，在我想将它添加到的应用程序文件夹中，以及在我想将它添加到的 lib 项目文件夹中。 在所有情况下，我都会收到消息The add command requires to be run in an Angular project, but a project definition could not be found.

Angular 材料文档曾经包含有关如何手动添加依赖项的说明，但我再也找不到了。 现在有谁知道如何将它添加到 Nx 工作区中的项目中吗？

Answer 1

如果您创建了一个没有 angular.json 的空工作区，您将拥有一个工作区。json，我认为这几乎相同。

假设您已经生成了一个 agular 应用程序：

1. 安装 angular 材料库： yarn add @angular/material

2. 从 nx 控制台查看可用命令： nx list @angular/material

3. 要将 angular 材质添加到默认项目： nx generate @angular/material:ng-add

PS。 可能它会在 nx not found/installed 上引发错误。 yarn add -g @nrwl/cli 。 我认为可以将 angular 材料添加到另一个项目中，还没有尝试过

https://github.com/nrwl/nx/issues/3779#issuecomment-751136586

Answer 2

npx nx g @angular/material:ng-add --project=my-project-name是您需要在 Nx 工作区中运行的命令。

不要忘记包含项目名称，否则您会看到错误。

此外，如果您仍然遇到错误，请尝试对有关Set up global Angular Material typography styles和Set up browser animations for Angular Material的问题回答no 。

免责声明：另一位成员已经在评论中正确回答了，但我认为应该置顶这样一个简单的答案。

Answer 3

npm install @angular/material && npx nx g @angular/material:ng-add

然后跟material docs一样

Answer 4

对于它的价值，我创建了一个新的 Angular 项目（没有 Nx）并在那里运行ng add @angular/material命令，然后查看产生的差异，并将这些更改应用到 Nx 工作区中，这似乎工作正常. 只是想知道是否有更好的方法。

Answer 5

Yarn 在使用主题时会导致构建错误。 我正在用纱线运行我的构建。 它会抱怨 @use '~@angular/material' as mat; 处于一个循环中。

Answer 6

查找 Nx angular 素材插件

nx 列表@角/材料

在开发依赖项中安装插件

npm install -D @angular/material

Answer 7

npm i @angular/material && npx nx g @angular/material:ng-add --project=my-project-name

那应该这样做。

Answer 8

yarn add -W @angular/material && yarn nx g @angular/material:ng-add

为我工作