Bienvenue sur CodeWise ! Si vous êtes nouveau ici, vous voudrez sans doute découvrir notre Starter Kit Angular : il contient une roadmap du parcours d'un dev Angular, ainsi qu'un cookbook des commandes les plus utiles et un extrait de formation. Cliquez ici pour le télécharger (c’est gratuit !)
Dans cet article, découvrez comment supprimer un composant de manière safe avec Angular.
On peut pas juste supprimer le dossier ?
Si vous vous contentez de supprimer le dossier d'un composant de votre application, une erreur apparaît dans votre console :
En effet, quand vous avez fait générer votre composant, il a été ajouté aux imports du module principal de votre application.
Maintenant qu'on veut supprimer le composant, cette déclaration nous pose problème.
Alors comment faire ?
Supprimer via La CLI ?
Malheureusement, il n'y a pas de commande pour supprimer un composant via la CLI et cette évolution n'est pas prévue dans les versions à venir pour l'instant.
La solution
Etape 1 : Supprimer les appels au composant
Premièrement, veillez à ce que votre composant ne soit appelé dans aucun template HTML via une balise <app-mon-composant>
.
Si votre composant est appelé via sa balise, supprimez l'appel en effaçant la balise.
Etape 2 : Supprimer le dossier
Dans un premier temps, il faut supprimer le dossier du composant.
Clic droit sur le dossier en question et sélectionner "Supprimer".
Mais si vous relancez la commande ng serve
tout de suite, l'erreur citée plus haut se déclenche.
Voyons donc comment la corriger.
Etape 3 : Retirer la déclaration du module
Une fois le dossier supprimé, il vous reste une chose à faire encore si non le serveur vous affiche toujours cette erreur Cannot find module
.
Il va falloir retirer deux lignes dans le fichier app.module.ts, l'import du composant en question et sa déclaration dans les import du @NgModule
:
Une fois que le composant n'est plus dans les imports du module, il n'essayera plus de se charger. Donc, vous n'aurez plus l'erreur.
Conclusion
Vous savez désormais supprimer un composant dans Angular !
N’hésitez pas à laisser un commentaire, en espérant que cela vous a plu.
Sources
- Angularjswiki : Comment supprimer un component dans Angular
Téléchargez votre Starter Kit Angular
En souscrivant vous recevrez :
- Une roadmap d'un développeur Angular
- Un cookbook Angular des commandes les plus utiles
- Un extrait de formation
100% gratuit.