angular-cli où est le fichier webpack.config.js - nouveau angular6 ne supporte pas l'éjection

Question

Mise à JOUR: décembre 2018 (voir 'M.' réponse)

Angulaire de la CLI 6, vous devez utiliser les bâtisseurs ng d'éjection est obsolète et sera bientôt supprimé dans 8.0

Mise à JOUR: juin 2018: Angulaire 6 ne prend pas en charge ng d'éjection**

Mise à JOUR: février 2017: l'utilisation ng d'éjection

Mise à JOUR: novembre 2016: angulaires-cli désormais utiliser uniquement webpack. Vous avez seulement besoin d'installer normalement avec npm install-g angulaires-cli. "Nous avons changé le système de construction entre la beta.10 et bêta.14, à partir de SystemJS à Webpack.", mais en fait j'utilise angulaires-cli juste des sapins de la structure et des dossiers, et puis en plus, j'utilise webpack config manuellement

J'ai installé angulaire de la cli avec ceci:

npm install -g angular-cli@webpack

Quand j'ai travaillé avec angular1 et web pack , je l'ai utilisé pour modifier "webpack.config.js" fichier pour l'exécuter toutes les tâches et les plugins, mais je ne vois pas sur ce projet créé avec angulaires-cli qui cela fonctionne. c'est de la magie?

Je vois Webpack est de travailler quand je fais:

ng serve 

"Version: webpack 2.1.0-beta.18"

mais je ne comprends pas la façon dont angulaires-cli config fonctionne...

Answer 1

Il y a une jolie façon de s'éjecter webpack.config.js à partir angulaires-cli. Il suffit d'exécuter:

$ ng eject

Cela va générer webpack.config.js dans le dossier racine de votre projet, et vous êtes libre de le configurer de la manière que vous voulez. L'inconvénient de cette est que construire/les scripts de démarrage de votre colis.json seront remplacées par les nouvelles commandes et au lieu de

$ ng serve

que vous avez à faire quelque chose comme

$ npm run build & npm run start

Cette méthode devrait fonctionner dans toutes les versions récentes de la angulaires-cli (j'ai personnellement essayé quelques-uns, la plus ancienne étant la version 1.0.0-bêta.21, et la dernière version 1.0.0-bêta.32.3)

Answer 2

Selon ce problème , la décision de ne pas autoriser les utilisateurs à modifier la configuration de Webpack pour réduire la courbe d'apprentissage était une décision de conception.

Compte tenu du nombre de configurations utiles sur Webpack, c'est un inconvénient majeur.

Je ne recommanderais pas d'utiliser angular-cli pour les applications de production, car cela suscite beaucoup d'opinion.

Answer 3

Angulaire de la CLI 6, vous devez utiliser les bâtisseurs ng d'éjection est obsolète et sera bientôt supprimé en 8.0. C'est ce qu'il dit quand j'ai essayer de faire un ng d'éjection

Vous pouvez utiliser angulaires-constructeurs de package (https://github.com/meltedspark/angular-builders) pour offrir personnalisé de votre webpack config.

J'ai essayé de résumer le tout dans un seul post de blog sur mon blog - Comment personnaliser la configuration de build custom webpack config Angulaire de la CLI 6

mais essentiellement, vous ajouter des dépendances suivantes -

  "devDependencies": {
    "@angular-builders/custom-webpack": "^7.0.0",
    "@angular-builders/dev-server": "^7.0.0",
    "@angular-devkit/build-angular": "~0.11.0",

Dans angulaire.json faire des modifications suivantes -

  "architect": {
    "build": {
      "builder": "@angular-builders/custom-webpack:browser",
      "options": {
        "customWebpackConfig": {"path": "./custom-webpack.config.js"},

Avis de changement de générateur et de la nouvelle option customWebpackConfig. Aussi changer

    "serve": {
      "builder": "@angular-builders/dev-server:generic",

Avis de changement de générateur de nouveau pour servir de cible. Post ces changements, vous pouvez créer un fichier appelé custom-webpack.config.js dans votre répertoire racine et ajouter votre webpack config.

Toutefois, contrairement à ng d'éjection de configuration fournies ici seront fusionnées avec la config par défaut donc juste ajouter studd vous voulez modifier/ajouter.

Answer 4

La CLI du webpack config peut maintenant être éjecté. Vérifier Anton Nikiforov de réponse.

---

obsolète:

Vous pouvez pirater la config modèle en angular-cli/addon/ng2/models. Il n'y a pas de manière officielle pour modifier le webpack config à partir de maintenant.

Il y a un fermé "wont-fix" question sur github à ce sujet: https://github.com/angular/angular-cli/issues/1656

Answer 5

Ce que je pense, c'est qu'avoir webpack soit facile lors de la sortie de la production.

Pour info: https://github.com/Piusha/ngx-lazyloading