Dans les dernières versions d'Angular cli, nous pouvons utiliser la commande ng g library lib-name pour créer une bibliothèque. Comme mentionné dans la documentation angulaire:
Project 'ngx-tab-component' does not support the 'serve' target. Error: Project 'ngx-tab-component' does not support the 'serve' target. at ServeCommand.initialize (C:\Users\vahidnajafi\angular\ngx-tab-app\node_modules\@angular\cli\models\architect-command.js:53:19) at <anonymous> at process._tickCallback (internal/process/next_tick.js:188:7) at Function.Module.runMain (module.js:695:11) at startup (bootstrap_node.js:191:16) at bootstrap_node.js:612:3
Et: p>
<project> The name of the project to build. Can be an app or a library.
Nous pouvons donc diffuser une bibliothèque . Mais lorsque je sers, j'obtiens les erreurs suivantes:
ng serve <project>
3 Réponses :
Le projet dans lequel vous générez votre bibliothèque sert d'hôte pour le déboguer et le tester.
Importez simplement votre bibliothèque dans votre module d'application hôte, assurez-vous que toutes les dépendances sont disponibles et servent l'application hôte. Toutes les modifications que vous apportez dans votre bibliothèque sont directement rechargées en direct dans votre application hôte.
Remarque: Vous devez importer < / p>
projets / foo-lib / src / public_api , et non "dist / foo-lib"
Utilisez le nom de votre bibliothèque officielle, par exemple @ foo / foo-library , angular le trouvera au bon endroit.
Merci pour votre réponse. Mais malheureusement, servir une application n'a aucun sens pour changer le code dans la bibliothèque.
bien que cela ait du sens, chaque changement dans votre bibliothèque est reflété dans l'application hôte. vous n'avez besoin que de ng serve , pas de ng build foo --watch comme vous l'avez suggéré.
vous devez importer 'projects / foo-lib / src / public_api' ou 'projects / foo-lib', mais pas 'dist / foo-lib'
Oui. vous avez tout à fait raison. Je vous remercie. Je vais accepter cette réponse. Veuillez donc ajouter votre dernier commentaire à la réponse. C'était le point.
Votre note est incorrecte. Vous devez importer des bibliothèques via votre dossier dist. De la même manière que vous importeriez des bibliothèques construites installées via npm, vous devez d'abord créer votre bibliothèque, puis l'importer. blog.angularindepth.com/... pour référence.
@StephenVerbist, l'a corrigé
@MarkusDresch Quelle est la structure globale de votre projet? Actuellement, je stocke mes bibliothèques dans NPM et elles existent séparément du composant hôte. J'ai donc eu l'idée de créer un projet hôte de démonstration et de le placer dans le même dossier pour tester et déboguer les bibliothèques dans le navigateur. La structure de mon projet est maintenant> projet >> dist >> packages >> test >> angular.json >> package.json >> ...
J'ai enfin trouvé la solution.
D'abord, je regarde la version construite de la bibliothèque en suivant (fourni à partir de Angular Cli 6.2 ):
import { FooLibModule } from 'dist/foo-lib';
Ensuite, je sers l'application simplement par:
ng serve
Et j'importe le module depuis le répertoire dist (car je peux regarder à la version compilée):
ng build foo-lib --watch
Ensuite, chaque changement dans ma bibliothèque entraîne des changements dans la version compilée, et mon application peut se recharger correctement.
Il semble le processus est un peu compliqué.
vous n'avez besoin que de ng serve et de l'importation depuis le dossier du projet.
Vous pouvez mettre à jour le chemin dans le tsconfig.json principal de
"paths": {
"library": {
"projects/library/src/public-api"
}
}
vers
"paths": {
"library": {
"dist/library"
}
}
Ensuite, Vous n'avez pas besoin de démarrer une version séparée pour votre bibliothèque et la reconstruction fonctionne également.
Tous les huzzle npm link et wait-for ont disparu. Agréable!
Je ne peux pas imaginer un contexte où il serait logique de servir une bibliothèque. Ce n'est pas une application, c'est une bibliothèque. Vous importez une bibliothèque dans une application que vous servez ultérieurement. Comment vous attendez-vous à ce que cela fonctionne?
@ R.Richards En fait, je ne m'y attendais pas. Mais dans la documentation, il est question de servir le projet (et le projet peut être une bibliothèque). Et s'il n'y avait pas de charge hépatique pour la bibliothèque, ce serait très difficile à développer.
Bons points. Il est étrange que les outils le mentionnent même s'il ne fait rien. Peut-être que cela est destiné à certaines fonctionnalités futures que nous ne connaissons pas encore. :)
Alors, comment puis-je tester ma bibliothèque? Dois-je servir une demande à chaque changement de bibliothèque? (C'est vraiment une douleur)
Avez-vous essayé de servir l'application qui utilise la bibliothèque, puis apportez des modifications à la bibliothèque pour voir si
ng servese recompile? Je n'ai pas essayé cela, mais ce serait bien que cela fonctionne.Non, ça ne marche pas.
@ R.Richards S'il vous plaît voir ma réponse. J'ai trouvé une solution pour cela.
@ R.Richards, c'est exactement comme ça que ça marche.