Почему Webpack напрямую импортирует webpack.config.babel.js?

Я новичок в довольно большом проекте ReactJS. На верхнем уровне он не имеет обычного webpack.config.js, а только `webpack.config.babel.js '. То, что это действительно используется, я могу проверить при запуске

> webpack

вызывается (через npm run с NODE_ENV = development и WEBPACK_CONFIG = server_dev², но это не имеет большого значения).

Почему это так?

a) Если я удалю этот babel-config, я получаю законную жалобу:

Конфигурационный файл можно назвать "webpack.config.js" в текущем каталог.

b) Если вместо этого я добавляю собственное do-почти-nothing webpack.config.js, которое действительно "правильное" (с webpack.config.babel.js больше не используется).

Итак, по-видимому, есть "invible" default webpack.config.js, который запускается, если этот файл отсутствует. И снова, по-видимому?, эта конфигурация по умолчанию каким-то образом удовлетворяет настройке webpack-конфигурации? К чему? В силу наличия этих node -модулей?

Или есть .babelrc файл-маркер сортов в webpack?

Интересно, что этот проект, preact-www, имеет то же самое. (а не оригинальную конфигурацию webpack, но вкус webpack). Значит, они что-то знают, я не...

Ответы

Ответ 1

Webpack использует interpret для загрузить Файл конфигурации. Требуется первый файл с basename webpack.config или webpackfile и любое расширение interpret знает. Кроме того, он отдает приоритет файлам .js.

После того, как он нашел конфигурацию, регистрирует соответствующий компилятор и требуется настройка. В частности, в случае .babel.js он пытается один за другим потребовать эти три модуля, пока не будет найден один из них. Если это удается, babel в основном перехватывает в требуемые файлы.

Ответ 2

TL;DR;

Начиная с версии 3 веб-страницы, вы можете использовать webpack.config.babel.js вместо той же вещи w/o '.babel' и с радостью включить ES6 в нее (фанкер import statement, const и т.д.)..) сразу.

Скажем, эта функция не задокументирована.

Позвольте мне поделиться с вами (неопределенным) исследованием:

В соответствии с этот связанный с ответом ответ, babel использует interpret, который "Требуют зависимости для файлов конфигурации".

Видимо, без него webpack не мог использовать ES6 для javascript в ваших файлах webpack.config. (И поскольку в основном требуется веб-пакет, чтобы перевести ES6 на ES5, у вас возникла бы проблема с курицей и яйцом, если бы веб-пакет сам по себе потребовал некоторую транспаляцию webpack раньше...)

Многие проекты, в том числе популярные те, сделайте следующее:

  • без webpack.config.js
  • используя webpack.config.babel.js, содержащий ES6 (контрольный знак: import), и сразу...

Итак, что похоже на наилучшую практику для файлов конфигурации ES6 Webpack, то? Кажется, хотя я не мог найти это в документации по webpack, кроме короткого обсуждение функций.

Btw: упомянутый пакет interpret по крайней мере в настоящее время уже поставляется с webpack 3.x. Нет необходимости устанавливать что-либо дополнительно:

/depot/own/webpacktest $ npm ls interpret

  [email protected] /depot/own/webpacktest
  └─┬ [email protected]
    └── [email protected]