Webpack собирает как CSS, так и JS файлы

Question

Моя проблема заключается в том, что webpack создает файлы js и css, когда входными данными является файл sass. Вот что выводит webpack. Я просто хочу, чтобы css-файлы передавались для scss, а не для обоих. Я не знаю, как это сделать. Я надеюсь, что кто-то может помочь. Вот мой код

let path = require("path");
let webpack = require("webpack");
let ExtractTextPlugin = require("extract-text-webpack-plugin");

let SRC = path.join(__dirname, "client", "src");
let DIST = path.join(__dirname, "client", "dist", "bundles");

module.exports = [{
    entry: {
        admin: SRC + "/js/admin/index.js",
        main: SRC + "/js/main/index.js",
        adminstyles: SRC + "/scss/admin/index.scss",
        mainstyles: SRC + "/scss/main/index.scss"

    },
    output: {
        path: DIST,
        filename: "[name]-bundle.js"
    },
    plugins: [
        new webpack.optimize.CommonsChunkPlugin({
                name: 'commons',
                filename: 'common.js',
                chunks: ['admin', 'main']
            }
        ),
        new ExtractTextPlugin("[name]-bundle.css")
    ],
    module: {
        loaders: [
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract("css!sass")
            },
            {test: /\.jsx?$/, loader: "babel-loader"}
        ]
    },
    resolve: {
        extensions: ["", ".js", ".jsx"],
        root: [path.join(__dirname, "client", "src", "js", "main")],
        modulesDirectories: ["node_modules"]
    }
}];

Answer 1

Каждая точка входа получает пакет JavaScript с кодом начальной загрузки веб-пакета, даже если содержимое извлекается с помощью extract-text-webpack-plugin, Вместо того, чтобы использовать отдельную точку входа для CSS, вы должны включить их в соответствующую точку входа, что также имеет концептуальный смысл, поскольку в них будут использоваться стили. каждый entry также принимает массив.

Ваша запись должна быть:

entry: {
    admin: [SRC + "/js/admin/index.js", SRC + "/scss/admin/index.scss"],
    main: [SRC + "/js/main/index.js",  SRC + "/scss/main/index.scss"]
},

Если вы хотите сохранить имена mainstyles а также adminstyles Вы также можете изменить extract-text-webpack-plugin чтобы:

new ExtractTextPlugin("[name]styles-bundle.css")