Webpack к каждой html-странице подключает ВСЕ css-файлы?

Question

[Василий Васильев]

Пробую перейти на вебпак, создал конфиг на билд двух страниц, у каждой свой css-файл стилей с уникальным именем.
Проблема: При билде к каждому html подключается сразу оба css-файла, несмотря на то, что в js-файле каждой страницы делаю импорт только одного файла.

Конфиг:

plugins: [
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: path.resolve(PATH.source.pages, 'home/home.pug')
        }),
        new HtmlWebpackPlugin({
            filename: 'pages/about.html',
            template: path.resolve(PATH.source.pages, 'about/about.pug')
        }),
        new ExtractTextPlugin({
            filename: "styles-[name].css",
            ignoreOrder: true,
            allChunks: true
        }),
    ],

Comments

[Василий Васильев]

P.S: при указании filename: "style.css" не сливает оба файла, а вторым перезаписывает первый.

[Василий Васильев]

Нашел костыльное решение, необходимо для каждого css-файла отдельно прописывать модуль и конфиг лодера(как для pug, только еще дублировать и лодер). При нескольких десятках страниц становится мозговыносительно, файл конфига очень сильно растет.

[profesor08]

Basil_Dev, программируй. У тебя в рука вся мощь node.js

Answer 1

[Александр Таратин]

new HtmlWebpackPlugin({
    filename: 'index.html',
    template: path.resolve(PATH.source.pages, 'home/home.pug'),
    chunks: ['<тут имена необходимых чанков - например index>']
})

Дальше все это дело добавляется через цикл к массиву плагинов.
https://github.com/jantimon/html-webpack-plugin#options

Comments

[Василий Васильев]

То, что нужно. Благодарю)