Comment générer des composants dans un dossier spécifique avec Angular CLI ?

Question

J'utilise Angular 4 avec Angular CLI et je suis capable de créer un nouveau composant avec la commande suivante.

E:\HiddenWords>ng generate component plainsight

Mais j'ai besoin de générer un composant enfant dans plainsight. Existe-t-il un moyen de le faire avec Angular CLI ?

Answer 1

Vous pouvez mentionner le chemin d'accès avec l'option ng g comando

ng g component plainsight/yourchildcompname

ce qui précède créera un yourchildcompname et les fichiers nécessaires dans le dossier plainsight. Si le dossier plainsight n'existe pas, il sera également créé.

Answer 2

El ng g component plainsight/some-name fait un nouveau répertoire quand nous l'utilisons.

Le résultat final sera :

plainsight/some-name/some-name.component.ts

Pour éviter cela, utilisez l'option option plate ng g component plainsight/some-name --flat et il va générer les fichiers sans créer un nouveau dossier

plainsight/some-name.component.ts

Answer 3

Il existe plusieurs méthodes pour créer un composant dans un répertoire spécifique.

Méthode 1 : "Ouvrir dans le terminal intégré" - Méthode rapide, simple et sans erreur

c'est-à-dire que vous voulez créer un composant dans une app/common comme indiqué dans l'image ci-dessous, puis suivez les étapes suivantes

1. Cliquez à droite sur le dossier dans lequel vous voulez créer le composant.
2. Sélectionnez l'option Open in Integrated Terminal o Open in Command Prompt .
3. Dans un nouveau terminal (vous verrez le chemin que vous avez sélectionné), puis tapez ng g c my-component

Vous pouvez également vérifier ce processus grâce à cette image

Méthode 2 : "Copier le chemin relatif" et coller sur le terminal

1. Cliquez avec le bouton droit de la souris sur le dossier dans lequel vous voulez créer le composant.
2. Dans le menu contextuel, sélectionnez Copy Relative Path
3. En terminale, tapez cd , appuyez sur space et ensuite ctrl + v pour coller le chemin copié et appuyez sur Enter
4. Vous verrez que le répertoire a été modifié.

Vous pouvez également vérifier ce processus grâce à cette image

Méthode 3 : Tapez le chemin complet sur le terminal

c'est-à-dire que vous voulez créer component dans un dossier, vous tapez la commande entière, y compris le chemin et le nom du composant.

ng g c relative-path/my-component

Vous pouvez également vérifier ce processus grâce à cette image

Note (méthode-3) : angular ne vous permet pas de créer un composant en dehors du dossier app, donc pour le composant, votre chemin de base sera app ; c'est pourquoi dans mon cas, j'ai dû commencer par auth/a-component au lieu de src/app/auth/a-component

Answer 4

ng g c component-name

Pour spécifier un emplacement personnalisé : ng g c specific-folder/component-name

aquí component-name sera créé dans le dossier spécifique.

Une approche similaire peut être utilisée pour générer d'autres composants tels que directive , pipe , service , class , guard , interface , enum , module etc.

Answer 5

Un code plus court pour générer le composant : ng g c component-name
pour préciser son emplacement : ng g c specific-folder/component-name

Informations complémentaires
un code plus court pour générer la directive : ng g d directive-name
pour préciser son emplacement : ng g d specific-folder/directive-name