How to remove components created with Angular-CLI

Question

I am working on angular2 for my new project, newly with this technology. I have set-up my project with angular CLI (Reference site https://github.com/angular/angular-cli). I have created 4 components using command ng generate component my-new-component For testing purpose, created one component app-testing, need to remove that component from my project. Else need to rename for that component. I have tried several like. ng destroy component app-testing but showing error The destroy command is not supported by Angular-CLI., Please help me with solution. Thanks in advance.

Solution 1

I had the same problems and it seems that they removed the destroy command from the CLI and you need to do it manually by deleting or renaming the according folders/files and imports, which is really a laborious task.

https://github.com/angular/angular-cli/issues/900 https://github.com/angular/angular-cli/issues/1788

Solution 2

You can delete any component by removing all its lines from app.module.ts . Its working fine for me.

Solution 3

version control is your friend here, do a diff or equivalent and you should see what's been added/modified.

In fact, removing the component folder might not be enough; with Angular-CLI v1.0, the command ng generate component my-new-component also edits your app.module.ts file by adding the respective import line and the component to the providers array.

Solution 4

You should remove your component manually, that is...

[name].component.ts
[name].component.html  // if you've used templateUrl in your component
[name].component.spec.ts  // if you've created test file
[name].component.[css or scss]  // if you've used styleUrls in your component

If you have all that files in a folder, delete the folder directly.

Then you need to go to the module which use that component and delete

import { [component_name] } from ...

and the component on the declarations array

That's all. Hope that helps

Solution 5

No As of now you can't do this by any command. You've to remove Manually from app.module.ts and app.routing.module.ts if you're using Angular 5

View more solutions