angle-cli wo ist die Datei webpack.config.js - new angle6 unterstützt ng eject nicht

UPDATE: Dezember 2018 (siehe 'Aniket'-Antwort)

Mit Angular CLI 6 müssen Sie Builder verwenden, da ng eject veraltet ist und in 8.0 bald entfernt wird

UPDATE: Juni 2018: Angular 6 unterstützt ng eject ** nicht

UPDATE: Februar 2017: Verwenden Sie ng eject

UPDATE: November 2016: angle-cli verwendet jetzt nur noch das Webpack. Sie müssen nur normal mit npm install -g angle-cli installieren. "Wir haben das Build-System zwischen Beta.10 und Beta.14 von SystemJS auf Webpack geändert."

Ich habe Angular Cli damit installiert:

npm install -g angular-cli@webpack

Als ich mit angle1 und web pack gearbeitet habe, habe ich die Datei "webpack.config.js" geändert, um alle Aufgaben und Plugins auszuführen, aber ich sehe bei diesem mit angle-cli erstellten Projekt nicht, wer es macht. es ist Magie?

Ich sehe, dass Webpack funktioniert, wenn ich es tue:

ng serve 

"Version: webpack 2.1.0-beta.18"

aber ich verstehe nicht, wie angular-cli config funktioniert ...

Mit Angular CLI 6 müssen Sie Builder verwenden, da ng eject veraltet ist und in 8.0 bald entfernt wird. Das steht, wenn ich versuche, einen ng-Auswurf durchzuführen

Sie können das Angular -Builder-Paket ( https://github.com/meltedspark/angular-builders ) verwenden, um Ihre benutzerdefinierte Webpack-Konfiguration bereitzustellen.

Ich habe versucht, alles in einem einzigen Blog-Beitrag in meinem Blog zusammenzufassen - So passen Sie die Build-Konfiguration mit der benutzerdefinierten Webpack-Konfiguration in Angular CLI 6 an

Im Wesentlichen fügen Sie jedoch folgende Abhängigkeiten hinzu:

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

Nehmen Sie in angle.json folgende Änderungen vor:

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

Beachten Sie die Änderung im Builder und die neue Option customWebpackConfig. Auch ändern

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

Beachten Sie die Änderung im Builder erneut für das Serve-Ziel. Nach diesen Änderungen können Sie eine Datei mit dem Namen custom-webpack.config.js in demselben Stammverzeichnis erstellen und dort Ihre Webpack-Konfiguration hinzufügen.

Im Gegensatz zur hier bereitgestellten ng-Auswurfkonfiguration wird sie jedoch mit der Standardkonfiguration zusammengeführt. Fügen Sie also einfach Dinge hinzu, die Sie bearbeiten / hinzufügen möchten.

Es gibt eine gute Möglichkeit, webpack.config.js aus angle -cli auszuwerfen . Renn einfach:

$ ng eject

Dadurch wird webpack.config.js im Stammordner Ihres Projekts generiert, und Sie können es nach Ihren Wünschen konfigurieren. Der Nachteil dabei ist, dass Build / Start-Skripte in Ihrer package.json durch die neuen Befehle ersetzt werden und stattdessen

$ ng serve

du müsstest so etwas tun

$ npm run build & npm run start

Diese Methode sollte in allen neueren Versionen von Angular-Cli funktionieren (ich persönlich habe einige ausprobiert, wobei die älteste 1.0.0-beta.21 und die neueste 1.0.0-beta.32.3 ist ).

Gemäß diesem Problem war es eine Entwurfsentscheidung, Benutzern nicht zu erlauben, die Webpack-Konfiguration zu ändern, um die Lernkurve zu verkürzen.

Angesichts der Anzahl nützlicher Konfigurationen in Webpack ist dies ein großer Nachteil.

Ich würde nicht empfehlen, angular-clifür Produktionsanwendungen zu verwenden, da es eine hohe Meinung hat.

Die Webpack-Konfiguration der CLI kann jetzt ausgeworfen werden. Überprüfen Sie die Antwort von Anton Nikiforov .

veraltet:

Sie können die Konfigurationsvorlage in hacken angular-cli/addon/ng2/models. Es gibt derzeit keine offizielle Möglichkeit, die Webpack-Konfiguration zu ändern.

Es gibt ein geschlossenes "Wont-Fix" -Problem bei Github: https://github.com/angular/angular-cli/issues/1656

Was ich denke ist, dass Webpack bei der Produktionsfreigabe einfach wäre.

Zu Ihrer Information: https://github.com/Piusha/ngx-lazyloading

Nach dem Vorschlag von ng ejectIhnen können verwendenngx-build-plus

Es gibt mehrere Projekte, die in Verbindung mit dem neuen Konfigurationsformat verwendet werden können und die Vorteile des Auswerfens ohne Wartungsaufwand bieten. Ein solches Projekt ist ngx-build-plus, das hier zu finden ist: https://github.com/manfredsteyer/ngx-build-plus