blocks|key|5213558|text|当我们使用它时，ng+g+component+plainsight/some-name会创建一个新目录。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|BOLD|entityRanges|data|5213559|最终输出将是：|5213560|plainsight/some-name/some-name.component.ts|code-block|syntax|javascript|5213561|要避免这种情况，请使用flat+option+ng+g+component+plainsight/some-name+--flat，它将生成文件，而无需创建新文件夹|5213562|plainsight/some-name.component.ts|5213563|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/angular/angular-cli/wiki/generate-component^0|8|Z|1C|3|0|0|0|N|16|20|4|B|B|0|0|0^^$0|@$1|2|3|4|5|6|7|Z|8|@$9|10|A|11|B|C]|$9|12|A|13|B|D]]|E|@]|F|$]]|$1|G|3|H|5|6|7|14|8|@]|E|@]|F|$]]|$1|I|3|J|5|K|7|15|8|@]|E|@]|F|$L|M]]|$1|N|3|O|5|6|7|16|8|@$9|17|A|18|B|C]|$9|19|A|1A|B|D]]|E|@$9|1B|A|1C|1|1D]]|F|$]]|$1|P|3|Q|5|K|7|1E|8|@]|E|@]|F|$L|M]]|$1|R|3|-4|5|6|7|1F|8|@]|E|@]|F|$]]]|S|$T|$5|U|V|W|F|$X|Y]]]]

The <code>ng g component plainsight/some-name</code> makes a new directory when we use it.

The final output will be:

<pre><code>plainsight/some-name/some-name.component.ts
</code></pre>

To avoid that, make use of the <a href="https://github.com/angular/angular-cli/wiki/generate-component" rel="noreferrer">flat option</a> <code>ng g component plainsight/some-name --flat</code> and it will generate the files without making a new folder 

<pre><code>plainsight/some-name.component.ts
</code></pre>

blocks|key|5213636|text|ng+g+c+component-name|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|5213637|对于指定自定义位置：ng+g+c+specific-folder/component-name|5213638|在这里，component-name将在specific-folder中创建。|5213639|类似的方法可以用于生成其他组件，如directive、pipe、service、class、guard、interface、enum、module等。|5213640|entityMap^0|0|L|0|A|11|0|4|E|0|H|9|R|4|W|7|14|5|1A|5|1G|9|1Q|4|1V|6|0^^$0|@$1|2|3|4|5|6|7|N|8|@$9|O|A|P|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|J|3|K|5|6|7|W|8|@$9|X|A|Y|B|C]|$9|Z|A|10|B|C]|$9|11|A|12|B|C]|$9|13|A|14|B|C]|$9|15|A|16|B|C]|$9|17|A|18|B|C]|$9|19|A|1A|B|C]|$9|1B|A|1C|B|C]]|D|@]|E|$]]|$1|L|3|-4|5|6|7|1D|8|@]|D|@]|E|$]]]|M|$]]

<code>ng g c component-name</code>

For specify custom location: <code>ng g c specific-folder/component-name</code>

here <code>component-name</code> will be created inside specific-folder.

Similarl approach can be used for generating other components like <code>directive</code>, <code>pipe</code>, <code>service</code>, <code>class</code>, <code>guard</code>, <code>interface</code>, <code>enum</code>, <code>module</code>, etc.

blocks|key|3797311|text|生成组件的更短代码：ng+g+c+component-name|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3797312|要指定其位置：ng+g+c+specific-folder/component-name|3797313|更多信息|3797314|生成指令的代码更短：ng+g+d+directive-name|3797315|要指定其位置：ng+g+d+specific-folder/directive-name|3797316|entityMap^0|A|L|0|7|11|0|0|A|L|0|7|11|0^^$0|@$1|2|3|4|5|6|7|P|8|@$9|Q|A|R|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|V|8|@]|D|@]|E|$]]|$1|J|3|K|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|L|3|M|5|6|7|Z|8|@$9|10|A|11|B|C]]|D|@]|E|$]]|$1|N|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|O|$]]

more shorter code to generate component: <code>ng g c component-name</code> 
to specify its location: <code>ng g c specific-folder/component-name</code> 

Additional info 
more shorter code to generate directive: <code>ng g d directive-name</code> 
to specify its location: <code>ng g d specific-folder/directive-name</code>

blocks|key|1461827|text|以上选项对我不起作用，因为与在终端中创建目录或文件不同，当CLI生成组件时，它会默认将src/路径添加到您输入的路径中。|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|1461828|如果我像这样从我的主应用程序文件夹生成组件(错误的方式)|1461829|ng+g+c+./src/app/child/grandchild+|code-block|syntax|javascript|1461830|生成的组件如下所示：|1461831|src/app/src/app/child/grandchild.component.ts|1461832|所以我只需要输入|1461833|ng+g+c+child/grandchild+|1461834|希望这能帮助到一些人|1461835|entityMap^0|17|4|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@$9|Z|A|10|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|11|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|12|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|13|8|@]|D|@]|E|$]]|$1|O|3|P|5|J|7|14|8|@]|D|@]|E|$K|L]]|$1|Q|3|R|5|6|7|15|8|@]|D|@]|E|$]]|$1|S|3|T|5|J|7|16|8|@]|D|@]|E|$K|L]]|$1|U|3|V|5|6|7|17|8|@]|D|@]|E|$]]|$1|W|3|-4|5|6|7|18|8|@]|D|@]|E|$]]]|X|$]]

The above options were not working for me because unlike creating a directory or file in the terminal, when the CLI generates a component, it adds the path src/app by default to the path you enter. 

If I generate the component from my main app folder like so (WRONG WAY)

<pre><code>ng g c ./src/app/child/grandchild 
</code></pre>

the component that was generated was this: 

<pre><code>src/app/src/app/child/grandchild.component.ts
</code></pre>

so I only had to type

<pre><code>ng g c child/grandchild 
</code></pre>

Hopefully this helps someone

blocks|key|1686640|text|It超级简单，|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|1686641|​|1686642|📷|atomic|1686643|1686644|另一种方式，|1686645|在终端中转到您文件夹，|1686646|**xxx\FOLDER_NAME>cd+FOLDER_NAME|1686647|xxx\FOLDER_NAME>+ng+generate+component+plainsight|1686648|如果您愿意像我一样复制路径(Visual+studio代码)，|1686649|1686650|1686651|1686652|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/70473e5bca779e8d664825e72a6a3fdf.png|imageAlt|1|https://ask.qcloudimg.com/http-save/yehe-900000/22f04f0e7b25b9168fded232d7819002.png^0|0|7|0|0|0|1|0|0|0|0|0|2|U|0|0|1D|0|0|0|0|1|1|0|0^^$0|@$1|2|3|4|5|6|7|19|8|@$9|1A|A|1B|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1C|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|1D|8|@]|D|@$9|1E|A|1F|1|1G]]|E|$]]|$1|K|3|G|5|6|7|1H|8|@]|D|@]|E|$]]|$1|L|3|M|5|6|7|1I|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|1J|8|@]|D|@]|E|$]]|$1|P|3|Q|5|6|7|1K|8|@$9|1L|A|1M|B|C]]|D|@]|E|$]]|$1|R|3|S|5|6|7|1N|8|@$9|1O|A|1P|B|C]]|D|@]|E|$]]|$1|T|3|U|5|6|7|1Q|8|@]|D|@]|E|$]]|$1|V|3|G|5|6|7|1R|8|@]|D|@]|E|$]]|$1|W|3|I|5|J|7|1S|8|@]|D|@$9|1T|A|1U|1|1V]]|E|$]]|$1|X|3|G|5|6|7|1W|8|@]|D|@]|E|$]]|$1|Y|3|-4|5|6|7|1X|8|@]|D|@]|E|$]]]|Z|$10|$5|11|12|13|E|$14|15|16|-4]]|17|$5|11|12|13|E|$14|18|16|-4]]]]

It Super Easy,
<a href="https://i.stack.imgur.com/oezqU.png" rel="noreferrer"><img src="https://i.stack.imgur.com/oezqU.png" alt="enter image description here" /></a>
Other way,
in terminal go your FOLDER,
**xxx\FOLDER_NAME&gt;cd FOLDER_NAME
xxx\FOLDER_NAME&gt; ng generate component plainsight
Bonus point if you lasy like me to copy path(Visual studio code),
<a href="https://i.stack.imgur.com/AjzgL.png" rel="noreferrer"><img src="https://i.stack.imgur.com/AjzgL.png" alt="enter image description here" /></a>

blocks|key|1461873|text|在特定文件夹中创建组件：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1461874|ng+g+c+folder-name/component-name|code-block|syntax|javascript|1461875|使用Angular-CLI在文件夹中为特定(现有)模块创建组件：|1461876|ng+g+c+folder-name/component-name+--module=folder-name/moduleName.module.ts|1461877|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Create a component inside a specific folder:
<pre><code>ng g c folder-name/component-name
</code></pre>
Create a component inside a folder for a specific (existing) module with Angular-CLI:
<pre><code>ng g c folder-name/component-name --module=folder-name/moduleName.module.ts
</code></pre>

blocks|key|1465815|text|使用'ng+generate+component+./target_directory/Component_Name‘|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1465816|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Use 'ng generate component ./target_directory/Component_Name'

blocks|key|3797354|text|ng+g+c+folderName/SubFolder/.../componentName+--spec=false+|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|3797355|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>ng g c folderName/SubFolder/.../componentName --spec=false 
</code></pre>

blocks|key|3797426|text|我在上面的答案(包括--flat)上没有任何幸运，但对我有效的是：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3797427|cd+path/to/specific/directory|code-block|syntax|javascript|3797428|在那里，我运行了ng+g+c+mynewcomponent|3797429|entityMap^0|A|6|0|0|8|L|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@]|E|$]]|$1|M|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|N|$]]

I wasn't having any luck with the above answers (including <code>--flat</code>), but what worked for me was:

<pre><code>cd path/to/specific/directory
</code></pre>

From there, I ran the <code>ng g c mynewcomponent</code>

blocks|key|5213832|text|要在VS代码中打开终端，只需输入CTRL+%2B+~即可打开终端。以下是步骤：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|5213833|5213834|检查需要在其中生成新组件的特定组件。|ordered-list-item|5213835|5213836|5213837|将路径重定向到需要在其中生成另一个组件的特定文件夹/组件|5213838|5213839|例如：cd+src/app/particularComponent|5213840|在particularComponent，的位置键入您需要用来生成新组件的组件名称。|BOLD|5213841|进入需要生成新组件的组件后，只需键入以下命令：ng+g+c+NewComponentName+|5213842|5213843|5213844|(将名称NewComponentName更改为所需的组件名称。)|5213845|entityMap^0|G|4|N|1|0|0|0|0|0|0|0|3|U|0|1|J|0|N|N|0|0|0|4|G|0^^$0|@$1|2|3|4|5|6|7|11|8|@$9|12|A|13|B|C]|$9|14|A|15|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|16|8|@]|D|@]|E|$]]|$1|G|3|H|5|I|7|17|8|@]|D|@]|E|$]]|$1|J|3|-4|5|6|7|18|8|@]|D|@]|E|$]]|$1|K|3|-4|5|6|7|19|8|@]|D|@]|E|$]]|$1|L|3|M|5|I|7|1A|8|@]|D|@]|E|$]]|$1|N|3|-4|5|6|7|1B|8|@]|D|@]|E|$]]|$1|O|3|P|5|6|7|1C|8|@$9|1D|A|1E|B|C]]|D|@]|E|$]]|$1|Q|3|R|5|6|7|1F|8|@$9|1G|A|1H|B|S]]|D|@]|E|$]]|$1|T|3|U|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@]|E|$]]|$1|V|3|-4|5|I|7|1L|8|@]|D|@]|E|$]]|$1|W|3|-4|5|6|7|1M|8|@]|D|@]|E|$]]|$1|X|3|Y|5|6|7|1N|8|@$9|1O|A|1P|B|S]]|D|@]|E|$]]|$1|Z|3|-4|5|6|7|1Q|8|@]|D|@]|E|$]]]|10|$]]

To open a terminal in VS code just type <code>CTRL</code> + <code>~</code> which will open the terminal. Here are the steps:
<ol>
<li>Check for the particular component where you need to generate the new component.
</li>
<li>Redirect the path to the particular folder/component where you need to generate another component
</li>
</ol>
FOR EXAMPLE: <code>cd src/app/particularComponent</code>
In the place of particularComponent, type the component name in which you need to generate the new component.
<ol start="3">
<li>Once you are in the component where you need to generate the new component, just type this command: <code>ng g c NewComponentName</code></li>
</ol>
(Change the name NewComponentName to your required component name.)

blocks|key|1686493|text|使用自定义目录时需要使用--dryRun|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1686494|您可以通过ng命令传递您的自定义目录路径。|offset|length|style|CODE|1686495|ng+g+c+myfolder\mycomponent|1686496|但是有可能你没有拼写出路径，或者创建了新的文件夹，或者目标目录发生了变化。因此，dryRun非常有用。它显示了更改将如何受到影响的输出。|1686497|📷|atomic|1686498|​|1686499|在验证结果之后，您可以不使用-d运行相同的命令来进行更改。|1686500|1686501|+--dryRun=true%7Cfalse|blockquote|1686502|1686503|如果为true，则遍历并报告活动，而不写出结果。|1686504|默认值:+false|1686505|别名：-d|1686506|1686507|官方文档:-+https://angular.io/cli/generate|1686508|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/b052f3023bdeccd59a65439657c5d7b0.png|imageAlt|1|LINK|MUTABLE|url|https://angular.io/cli/generate^0|0|5|2|0|0|R|0|14|6|0|0|1|0|0|0|E|2|0|0|0|0|0|0|0|0|7|V|1|0^^$0|@$1|2|3|4|5|6|7|1K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|1L|8|@$D|1M|E|1N|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|1O|8|@$D|1P|E|1Q|F|G]]|9|@]|A|$]]|$1|J|3|K|5|6|7|1R|8|@$D|1S|E|1T|F|G]]|9|@]|A|$]]|$1|L|3|M|5|N|7|1U|8|@]|9|@$D|1V|E|1W|1|1X]]|A|$]]|$1|O|3|P|5|6|7|1Y|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|1Z|8|@$D|20|E|21|F|G]]|9|@]|A|$]]|$1|S|3|-4|5|6|7|22|8|@]|9|@]|A|$]]|$1|T|3|U|5|V|7|23|8|@]|9|@]|A|$]]|$1|W|3|-4|5|6|7|24|8|@]|9|@]|A|$]]|$1|X|3|Y|5|6|7|25|8|@]|9|@]|A|$]]|$1|Z|3|10|5|6|7|26|8|@]|9|@]|A|$]]|$1|11|3|12|5|6|7|27|8|@]|9|@]|A|$]]|$1|13|3|-4|5|6|7|28|8|@]|9|@]|A|$]]|$1|14|3|15|5|6|7|29|8|@]|9|@$D|2A|E|2B|1|2C]]|A|$]]|$1|16|3|-4|5|6|7|2D|8|@]|9|@]|A|$]]]|17|$18|$5|19|1A|1B|A|$1C|1D|1E|-4]]|1F|$5|1G|1A|1H|A|$1I|1J]]]]

Need for using --dryRun when using custom directory
You can pass your custom directory path along with <code>ng</code> command.
<code>ng g c myfolder\mycomponent</code>
But there are chances that you miss spell the path and either new folder gets created or target directory changes. For this reason <code>dryRun</code> is very helpful. It displays an output of how the changes is going to be affected. 
<a href="https://i.stack.imgur.com/PtKY5.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PtKY5.png" alt="enter image description here" /></a>
After verifying the result you can run the same command without <code>-d</code> to make the changes.
<blockquote>
--dryRun=true|false
When true, runs through and reports activity without writing out results.
Default: false
Aliases: -d
</blockquote>
Official Doc :- <a href="https://angular.io/cli/generate" rel="nofollow noreferrer">https://angular.io/cli/generate</a>

blocks|key|3797448|text|Angular+CLI提供了应用程序开发中所需的所有命令。对于您的特定需求，您可以轻松地使用ng+g+(ng+generate)来完成工作。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3797449|ng+g+c+directory/component-name将在directory文件夹中生成component-name组件。|3797450|下面是您可以在应用程序中使用的几个简单命令的映射。|3797451|3797452|ng+g+c+comp-name或ng+generate+component+comp-name创建名为'serv-name'|ordered-list-item|3797453|ng+g+m+mod-name的组件或ng+generate+module+mod-name创建名为'mod-name'|3797454|ng+g+m+mod-name+--routing或ng+generate+module+mod-name+--routing的模块创建名为‘mod-ng+generate+component+comp-name’的模块以及angular+routing|3797455|3797456|希望这能有所帮助！|3797457|祝好运!|3797458|entityMap^0|1A|4|1G|B|0|0|V|X|9|1C|E|0|0|0|0|G|H|V|0|0|F|J|R|0|0|P|Q|11|23|V|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@$9|Z|A|10|B|C]|$9|11|A|12|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|13|8|@$9|14|A|15|B|C]|$9|16|A|17|B|C]|$9|18|A|19|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|1A|8|@]|D|@]|E|$]]|$1|J|3|-4|5|6|7|1B|8|@]|D|@]|E|$]]|$1|K|3|L|5|M|7|1C|8|@$9|1D|A|1E|B|C]|$9|1F|A|1G|B|C]]|D|@]|E|$]]|$1|N|3|O|5|M|7|1H|8|@$9|1I|A|1J|B|C]|$9|1K|A|1L|B|C]]|D|@]|E|$]]|$1|P|3|Q|5|M|7|1M|8|@$9|1N|A|1O|B|C]|$9|1P|A|1Q|B|C]|$9|1R|A|1S|B|C]]|D|@]|E|$]]|$1|R|3|-4|5|6|7|1T|8|@]|D|@]|E|$]]|$1|S|3|T|5|6|7|1U|8|@]|D|@]|E|$]]|$1|U|3|V|5|6|7|1V|8|@]|D|@]|E|$]]|$1|W|3|-4|5|6|7|1W|8|@]|D|@]|E|$]]]|X|$]]

Angular CLI provides all the commands you need in your app development. For your specific requirement, you can easily use <code>ng g</code> (<code>ng generate</code>) to get the work done. 

<code>ng g c directory/component-name</code> will generate <code>component-name</code> component in the <code>directory</code> folder.

Following is a map of a few simple commands you can use in your application.

<ol>
<li><code>ng g c comp-name</code> or <code>ng generate component comp-name</code> to create a component with the name 'comp-name'</li>
<li><code>ng g s serv-name</code> or <code>ng generate service serv-name</code> to create a service with the name 'serv-name'</li>
<li><code>ng g m mod-name</code> or <code>ng generate module mod-name</code> to create a module with the name 'mod-name'</li>
<li><code>ng g m mod-name --routing</code> or <code>ng generate module mod-name --routing</code> to create a module with the name 'mod-name' with angular routing</li>
</ol>

Hope this helps!

Good Luck!

blocks|key|5214519|text|2021使用IDE插件进一步提高速度|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5214520|如果你想进一步加快这个通常的过程，并避免耗费时间的常见错误，你可以尝试使用visual+studio代码插件。|5214521|例如，我使用Angular-Schematics，并且避免使用终端。您可以使用鼠标选择来调用ng+cli。|offset|length|5214522|​|5214523|📷|atomic|5214524|5214525|entityMap|0|LINK|mutability|MUTABLE|url|https://marketplace.visualstudio.com/items?itemName=cyrilletuzi.angular-schematics|1|IMAGE|IMMUTABLE|imageUrl|https://i.stack.imgur.com/ra2Xc.gif|imageAlt^0|0|0|6|I|0|0|0|0|1|1|0|0^^$0|@$1|2|3|4|5|6|7|11|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|12|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|13|8|@]|9|@$F|14|G|15|1|16]]|A|$]]|$1|H|3|I|5|6|7|17|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|18|8|@]|9|@$F|19|G|1A|1|1B]]|A|$]]|$1|M|3|I|5|6|7|1C|8|@]|9|@]|A|$]]|$1|N|3|-4|5|6|7|1D|8|@]|9|@]|A|$]]]|O|$P|$5|Q|R|S|A|$T|U]]|V|$5|W|R|X|A|$Y|Z|10|-4]]]]

<h2>2021 Further speed up using IDE pluggins</h2>
If you want to further speed up this usual process and avoid common mistakes which cost you time you can try with visual studio code plugins.
For example I use <a href="https://marketplace.visualstudio.com/items?itemName=cyrilletuzi.angular-schematics" rel="nofollow noreferrer">Angular-Schematics</a> and I avoid the terminal. You can invoke the ng cli with your mouse selections.
<a href="https://i.stack.imgur.com/ra2Xc.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ra2Xc.gif" alt="enter image description here" /></a>

blocks|key|1687148|text|使用以下命令打开特定文件夹终端|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1687149|ng+g+c组件名称--平面|1687150|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

Open the specific folder Terminal use this command
ng g c component name --flat

blocks|key|1465649|text|简单|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1465650|ng+g+component+plainsight/some-name|code-block|syntax|javascript|1465651|它将创建"plainsight“文件夹，并在其中生成一些名称组件。|1465652|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Simple

<pre><code>ng g component plainsight/some-name
</code></pre>

It will create "plainsight" folder and generate some-name component inside it.

blocks|key|5213659|text|试着使用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5213660|ng+g+component+plainsight/some-name.component.ts|code-block|syntax|javascript|5213661|或者手动尝试，如果你觉得更舒服的话。|5213662|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Try to use

<pre><code>ng g component plainsight/some-name.component.ts
</code></pre>

Or try it manually, if you feel more comfortable.

blocks|key|5213678|text|在命令提示或项目终端中转到项目文件夹。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5213679|运行cmd+:+ng+g+c组件名|5213680|​|5213681|📷|atomic|offset|length|5213682|5213683|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/aaa42db2e3347fa9060d14663b2b68e8.png|imageAlt^0|0|0|0|0|1|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|V|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|W|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|X|8|@]|9|@$I|Y|J|Z|1|10]]|A|$]]|$1|K|3|E|5|6|7|11|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|M|$N|$5|O|P|Q|A|$R|S|T|-4]]]]

Go to project folder in command prompt or in Project Terminal.

Run cmd : ng g c componentname

<a href="https://i.stack.imgur.com/jD4qm.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jD4qm.png" alt="enter image description here"></a>

blocks|key|1686402|text|一旦你进入你的项目目录。先使用cd+path/to/directory，然后再使用ng+g+c+component_name+--spec=false它会自动执行所有操作，并且没有错误|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1686403|g+c表示生成组件|1686404|entityMap^0|F|K|15|Y|0|0|3|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]|$9|M|A|N|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|R|8|@]|D|@]|E|$]]]|I|$]]

Once you are in the directory of your project.
use <code>cd path/to/directory</code> then use <code>ng g c component_name --spec=false</code> it automates everything and is error free

the <code>g c</code> means generate component

blocks|key|3797484|text|首先要创建一个你需要使用的组件：-|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3797485|3797486|ng+g+c组件名称|unordered-list-item|3797487|3797488|通过使用上述命令，将在包含以下内容的文件夹中创建新组件|3797489|(组件名)您在上面指定的。|3797490|但如果您需要在另一个组件中或在特定文件夹中创建组件：-|3797491|componentname/newComponentName的|3797492|ng+g+c|3797493|3797494|entityMap^0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|U|8|@]|9|@]|A|$]]|$1|C|3|D|5|E|7|V|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|W|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|X|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|Y|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|Z|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|10|8|@]|9|@]|A|$]]|$1|O|3|P|5|E|7|11|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|12|8|@]|9|@]|A|$]]|$1|R|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|S|$]]

<h2>Firstly to create a Component you need to use:-</h2>

<ul>
<li>ng g c componentname

By using above command New Component will be created in a folder with 
(componentname) you specified above.</li>
</ul>

<h2>But if you need to create a component inside of another component or in specific folder:-</h2>

<ul>
<li>ng g c componentname/newComponentName</li>
</ul>

blocks|key|3797508|text|如果使用VSCode，请考虑使用Angular+Console|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|3797509|它为Angular+CLI提供了一个接口。您将看到一个用于指定路径的选项。|3797510|3797511|的Angular命令行界面是非常强大和可扩展的。事实上，有如此多的功能，对于开发人员来说，拥有每个可用命令的所有不同配置选项是很有帮助的。|blockquote|3797512|3797513|有了Angular+Console，你会得到推荐，甚至可以拉出最容易忘记或很少使用的功能！|3797514|Angular控制台首先也是最重要的，是使用Angular命令行界面提供的更高效的工作方式。|3797515|entityMap|0|LINK|mutability|MUTABLE|url|https://angularconsole.com/^0|G|F|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@$A|X|B|Y|1|Z]]|C|$]]|$1|D|3|E|5|6|7|10|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|11|8|@]|9|@]|C|$]]|$1|G|3|H|5|I|7|12|8|@]|9|@]|C|$]]|$1|J|3|-4|5|6|7|13|8|@]|9|@]|C|$]]|$1|K|3|L|5|6|7|14|8|@]|9|@]|C|$]]|$1|M|3|N|5|6|7|15|8|@]|9|@]|C|$]]|$1|O|3|-4|5|6|7|16|8|@]|9|@]|C|$]]]|P|$Q|$5|R|S|T|C|$U|V]]]]

If you use VSCode, consider using the <a href="https://angularconsole.com/" rel="nofollow noreferrer">Angular Console</a>
It provides an interface for the Angular CLI. You will see an option to specify the path.
<blockquote>
The Angular CLI is immensely powerful and extensible. In fact, there are so many capabilities that it is helpful for developers to have all of the different configuration options for every command available to them.
With Angular Console, you’ll get recommendations and be able to pull up even the most easily forgotten or rarely used features!
Angular Console is, first and foremost, a more productive way to work with what the Angular CLI provides.
</blockquote>

I am using Angular 4 with Angular CLI and I am able to create a new component with the following command.
<pre><code>E:\HiddenWords&gt;ng generate component plainsight
</code></pre>
But I need to generate a child component inside plainsight. Is there a way to do it with Angular CLI?

How to generate components in a specific folder with Angular CLI?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

我正在使用Angular 4和Angular CLI，并且我可以使用以下命令创建一个新组件。E:\HiddenWords>ng generate component plainsight但我需要在plainsight中生成子组件。有没有办法用Angular CLI做到这一点？

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

回答 20

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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

回答 20

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

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