Почему не работает Webpack?

Question

[Игорь]

Хочу настроить сборку проекта scss + js. Делаю так, как описано в статье https://tproger.ru/translations/webpack-basics/ ,
но после установки пакетов для компиляции стилей (npm install style-loader css-loader sass-loader node-sass extract-text-webpack-plugin -D) и запуска npm run build получаю такие ошибки. Что делать понятия не имею.

E:\projects\onepage>npm run build

> onepage@1.0.0 build E:\projects\onepage
> webpack

(node:9448) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
E:\projects\onepage\node_modules\webpack\lib\Chunk.js:827
                throw new Error(
                ^

Error: Chunk.entrypoints: Use Chunks.groupsIterable and filter by instanceof Entrypoint instead
    at Chunk.get (E:\projects\onepage\node_modules\webpack\lib\Chunk.js:827:9)
    at E:\projects\onepage\node_modules\extract-text-webpack-plugin\dist\index.js:176:48
    at Array.forEach (<anonymous>)
    at E:\projects\onepage\node_modules\extract-text-webpack-plugin\dist\index.js:171:18
    at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\projects\onepage\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:7:1)
    at AsyncSeriesHook.lazyCompileHook (E:\projects\onepage\node_modules\tapable\lib\Hook.js:154:20)
    at Compilation.seal (E:\projects\onepage\node_modules\webpack\lib\Compilation.js:1215:27)
    at hooks.make.callAsync.err (E:\projects\onepage\node_modules\webpack\lib\Compiler.js:541:17)
    at _err0 (eval at create (E:\projects\onepage\node_modules\tapable\lib\HookCodeFactory.js:32:10), <anonymous>:11:1)
    at _addModuleChain (E:\projects\onepage\node_modules\webpack\lib\Compilation.js:1066:12)
    at processModuleDependencies.err (E:\projects\onepage\node_modules\webpack\lib\Compilation.js:982:9)
    at _combinedTickCallback (internal/process/next_tick.js:132:7)
    at process._tickCallback (internal/process/next_tick.js:181:9)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! onepage@1.0.0 build: `webpack`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the onepage@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Сергей\AppData\Roaming\npm-cache\_logs\2018-10-12T11_03_54_834Z-debug.log

Answer 1

[Danila]

скорей всего в статье используется старая версия webpack, c версии 4+ extract-text-webpack-plugin не поддерживается. Вместо него рекомендуется использовать mini-css-extract-plugin
Не рекомендую следовать устаревшей статье, т.к с 4-ой версии API довольно сильно изменилось, лучше читать документацию
Ну или откатить у себя webpack до 3 версии.

Comments

[Игорь]

Спасибо большое.