logo标签列表

如何使用Angular CLI在特定文件夹中生成组件？

angulartypescriptangular-cli
387

我正在使用 Angular CLI 和 Angular 4，可以通过以下命令创建一个新的组件。

E:\HiddenWords>ng generate component plainsight

但是我需要在明显的地方生成一个子组件。在使用Angular CLI的情况下是否有方法可以实现？

22
生成组件的命令为 "ng generate component your/path/from/the/app/folder/plainsight"。 - maxime1992
7
正如@Maxime所提到的，或者进入该目录(cd into the directory)。 - Z. Bagley
1
如果你第一次运行 ng generate component plainsight 时得到了一个不错的结果，现在你想要生成一个子组件，那么只需要运行 ng generate component plainsight/child 即可。 - Martin Zamora
3
我使用的一个方便的工具是在命令的末尾加上-d，这将执行干运行，即不会实际将文件添加到您的项目中，只会显示它们应该放置的位置。这样，您就可以检查它们是否进入了所需的文件夹：ng generate component path/to/folder/plainsight -d - Juan Pablo
23个回答
5

要在 VS code 中打开终端，只需键入 CTRL + ~ 即可打开终端。以下是具体步骤：

  1. 检查需要生成新组件的特定组件。

  2. 将路径重定向到需要生成另一个组件的特定文件夹/组件。

例如：cd src/app/particularComponent

在particularComponent的位置，输入您需要生成新组件的组件名称。

  1. 一旦进入需要生成新组件的组件，请输入此命令：ng g c NewComponentName

(将名称NewComponentName更改为所需的组件名称。)

4

2021年进一步加速使用IDE插件

如果想要进一步加快常规的流程并避免花费时间的常见错误，可以尝试使用Visual Studio Code插件。

例如，我使用Angular-Schematics并避免使用终端。你可以通过鼠标选择来调用ng cli。

enter image description here

3

在使用自定义目录时，使用--dryRun的必要性

您可以通过ng命令传递自定义目录路径。

ng g c myfolder\mycomponent

但是有可能会拼写错误路径，导致要么新文件夹被创建，要么目标目录被更改。为此，dryRun非常有用。它会显示更改将如何影响的输出。
enter image description here

验证结果后，您可以运行相同的命令，不带-d选项来执行更改。

--dryRun=true|false

当为true时，运行并报告活动，但不会写入结果。

默认值：false

别名：-d

官方文档：- https://angular.io/cli/generate

3
Angular CLI提供了所有您在应用程序开发中需要的命令。对于您的特定要求，您可以轻松使用ng g（ng generate）完成工作。 ng g c directory/component-name 将在directory文件夹中生成名为component-name的组件。
以下是您可以在应用程序中使用的一些简单命令列表：
  1. ng g c comp-name或ng generate component comp-name创建名为“comp-name”的组件
  2. ng g s serv-name或ng generate service serv-name创建名为“serv-name”的服务
  3. ng g m mod-name或ng generate module mod-name创建名为“mod-name”的模块
  4. ng g m mod-name --routing或ng generate module mod-name --routing创建具有angular路由的名为“mod-name”的模块
希望这可以帮助您！
祝好运！
2

打开特定的文件夹终端并使用以下命令：

ng g c 组件名 --flat

2

打开终端窗口并导航到 Angular 项目的根目录。创建一个文件夹

运行以下命令在特定文件夹中生成一个新组件：

ng generate component <folderName>/<componentName>

例如，如果您想在名为"components"的文件夹中创建一个名为"myComponent"的新组件，则命令如下：
ng generate component components/myComponent
1
一旦您进入项目目录。 使用 cd path/to/directory ，然后使用 ng g c component_name 自动化所有内容且无错误。 < p > gc 表示生成组件

1
我在Angular 9中遇到了以下错误：“未知选项：'--spec'” - Vikram kumar Chhajer
不要忽略规范文件。测试是有原因的。 - Pogrindis
1

打开命令提示符或项目终端并进入项目文件夹。

运行命令：ng g c componentname

enter image description here

1
简单
ng g component plainsight/some-name

它将创建“plainsight”文件夹并在其中生成名为some-name的组件。
1
尝试使用。
ng g component plainsight/some-name.component.ts

或者如果您感觉更舒适，可以手动尝试。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接