angular-cli, где находится файл webpack.config.js - новый angular6 не поддерживает извлечение ng

ОБНОВЛЕНИЕ: декабрь 2018 г. (см. Ответ Aniket)

С Angular CLI 6 вам нужно использовать построители, поскольку ng eject устарел и скоро будет удален в 8.0

ОБНОВЛЕНИЕ: июнь 2018: Angular 6 не поддерживает извлечение **

ОБНОВЛЕНИЕ: февраль 2017 года: используйте ng eject

ОБНОВЛЕНИЕ: ноябрь 2016 г .: angular-cli теперь использует только webpack. Вам нужно всего лишь выполнить обычную установку с помощью npm install -g angular-cli. «Мы изменили систему сборки между beta.10 и beta.14, с SystemJS на Webpack.», Но на самом деле я использую angular-cli только для первой структуры и папок, а затем больше, я использую конфигурацию webpack вручную

Я установил angular cli следующим образом:

npm install -g angular-cli@webpack

Когда я работал с angular1 и веб-пакетом, я модифицировал файл «webpack.config.js» для выполнения всех задач и плагинов, но я не вижу в этом проекте, созданном с помощью angular-cli, кто это работает. это магия?

Я вижу, что Webpack работает, когда:

ng serve 

"Version: webpack 2.1.0-beta.18"

но я не понимаю, как работает конфигурация angular-cli ...

С Angular CLI 6 вам нужно использовать компоновщики, так как ng eject устарел и скоро будет удален в 8.0. Это то, что он говорит, когда я пытаюсь выполнить выброс

Вы можете использовать пакет angular- builders ( https://github.com/meltedspark/angular-builders ), чтобы предоставить свою настраиваемую конфигурацию веб-пакета.

Я попытался обобщить все в одном сообщении в моем блоге - Как настроить конфигурацию сборки с помощью пользовательской конфигурации веб-пакета в Angular CLI 6

но по сути вы добавляете следующие зависимости -

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

В angular.json внесите следующие изменения -

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

Обратите внимание на изменения в построителе и новую опцию customWebpackConfig. Также измените

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

Обратите внимание на изменение конструктора для цели подачи. Опубликуйте эти изменения, вы можете создать файл с именем custom-webpack.config.js в том же корневом каталоге и добавить туда свою конфигурацию веб-пакета.

Однако, в отличие от представленной здесь конфигурации ng eject, она будет объединена с конфигурацией по умолчанию, поэтому просто добавьте то, что вы хотите отредактировать / добавить.

Есть хороший способ извлечь webpack.config.js из angular-cli . Просто беги:

$ ng eject

Это сгенерирует webpack.config.js в корневой папке вашего проекта, и вы сможете настроить его так, как хотите. Обратной стороной этого является то, что скрипты сборки / запуска в вашем package.json будут заменены новыми командами и вместо

$ ng serve

вам нужно будет сделать что-то вроде

$ npm run build & npm run start

Этот метод должен работать во всех последних версиях angular-cli (я лично пробовал несколько, самая старая из которых - 1.0.0-beta.21 , а последняя 1.0.0-beta.32.3 )

Согласно этой проблеме , это было дизайнерское решение, не позволяющее пользователям изменять конфигурацию Webpack, чтобы сократить время обучения.

Учитывая количество полезных настроек в Webpack, это большой недостаток.

Я бы не рекомендовал использовать его angular-cliдля производственных приложений, так как это очень категорично.

Конфигурация веб-пакета интерфейса командной строки теперь может быть удалена. Проверьте ответ Антона Никифорова .

устареть:

Вы можете взломать шаблон конфигурации в angular-cli/addon/ng2/models. На данный момент нет официального способа изменить конфигурацию веб-пакета.

В github есть закрытая проблема с "обычным исправлением": https://github.com/angular/angular-cli/issues/1656

Я думаю, что веб-пакет будет легко при выпуске в производство.

К вашему сведению: https://github.com/Piusha/ngx-lazyloading

Согласно предложению ng ejectвы можете использоватьngx-build-plus

Есть несколько проектов, которые можно использовать в сочетании с новым форматом конфигурации, которые обеспечивают преимущества извлечения без дополнительных затрат на обслуживание. Один из таких проектов - ngx-build-plus, который можно найти здесь: https://github.com/manfredsteyer/ngx-build-plus