我尝试使用“ng destroy component foo”,它告诉我“Angular-CLI不支持销毁命令”
如何使用Angular CLI正确地删除组件?
我尝试使用“ng destroy component foo”,它告诉我“Angular-CLI不支持销毁命令”
如何使用Angular CLI正确地删除组件?
destroy或类似的东西可能会出现在CLI中,但这不是目前的主要焦点。因此,您需要手动执行此操作。
删除组件目录(假设你没有使用——flat),然后将它从声明它的NgModule中移除。
如果你不确定该怎么做,我建议你有一个“干净”的应用程序,这意味着当前git没有变化。然后生成一个组件,并查看在repo中更改了什么,这样您就可以从那里回溯删除组件所需做的事情。
更新
如果您只是在试验您想要生成的内容,您可以使用——dry-run标志在磁盘上不生成任何文件,只查看更新的文件列表。
删除包含该组件的文件夹。 在app.module.ts中,删除该组件的import语句,并从@NgModule的声明部分中删除它的名称 从index.ts中删除包含此组件的export语句的行。
目前,Angular CLI不支持删除组件的选项,你需要手动执行。
从app.module中删除每个组件的导入引用 删除组件文件夹。 你还需要从app.module.ts文件中的@NgModule声明数组中删除组件声明
因为angular CLI还不支持它
所以这里是可能的方法,在此之前,请观察当你使用CLI创建一个组件/服务时会发生什么(ex. ng g c demoComponent)。
它创建了一个名为demoComponent的单独文件夹。 它生成HTML,CSS,ts和一个专门用于demoComponent的规范文件。 此外,它还在app.module.ts文件中添加依赖项,将该组件添加到项目中。
所以按相反的顺序来做
从app.module.ts中移除依赖项 删除该组件文件夹。
在消除依赖时,您必须做两件事。
从app.module.ts文件中删除导入行引用。 从app.module.ts中的@NgModule声明数组中删除组件声明。
我不确定这是否是最好的方法,但它对我来说很有效。
首先,我删除了组件文件夹。 然后,我清除了app.module。与我想删除的组件相关的导入和声明的app.component.ts、app.component.ts和app.component.html。 类似地,我清除了main.ts。
我只是保存并刷新了应用程序,它工作了。
从app.module.ts:
删除特定组件的导入行; 删除它在@NgModule中的声明;
然后删除想要删除的组件的文件夹及其包含的文件(.component.ts, .component.html, .component.css和.component.spec.ts)。
完成了。
-
我看到有人说要把它从main。ts中删除。你不应该首先从那里导入它,因为它已经导入了AppModule,而AppModule是导入你创建的所有组件的那个。
使用Visual Studio Code,删除组件文件夹,并在项目资源管理器(左侧)中看到显示为红色的文件,这意味着文件受到了影响并产生了错误。打开每个文件并删除使用该组件的代码。
我写了一个bash脚本,它应该自动执行下面Yakov Fain所写的过程。它可以像。/removeComponent这样调用
#!/bin/bash
if [ "$#" -ne 1 ]; then
echo "Input a component to delete"
exit 1
fi
# finds folder with component name and deletes
find . -type d -name $1 | xargs rm -rf
# removes lines referencing the component from app.module.ts
grep -v $1 app.module.ts > temp
mv temp app.module.ts
componentName=$1
componentName+="Component"
grep -v -i $componentName app.module.ts > temp
mv temp app.module.ts
这是Angular 2+的答案
从app.modules.ts的导入和声明数组中删除组件。
其次检查它的引用是否添加到其他模块中,如果是则删除它
最后手动删除该组件从应用程序,你就完成了。
或者你也可以反过来做。
我需要删除一个Angular 6指令,它的规范文件是错误的。即使在删除了违规文件,删除了对它的所有引用并重新构建应用程序后,TS仍然报告了相同的错误。对我有用的是重新启动Visual Studio -这清除了错误和所有不需要的旧指令的痕迹。
这是Angular CLI不支持的,而且他们也不打算很快把它包括进来。
这里是链接到实际创建的问题- https://github.com/angular/angular-cli/issues/1776
以及官方给出的解决方案截图