使用 extract-text-webpack-plugin 将 scss 提取到多个文件中？答案

【问题标题】：Extract scss into multiple files using extract-text-webpack-plugin?使用 extract-text-webpack-plugin 将 scss 提取到多个文件中？
【发布时间】：2016-05-31 11:37:51
【问题描述】：

我的文件夹结构是这样的

|
|-scss/
    |-main1.scss
    |-main2.scss

是否可以使用 extract-text-webpack-plugin 将这两个入口点提取两个单独的文件？

目前，我将其作为单个文件获取。

【问题讨论】：

标签： sass webpack

【解决方案1】：

如果你像这样在 webpack 配置中指定两个入口点：

entry: {
    main1: __dirname + '/src/main1.js',
    main2: __dirname + '/src/main2.js',
},
ouput: {
    path: __dirname,
    filename: '[name].js'
}

我假设你的 main1.scss 被导入到 main1.js 文件中，main2.scss 被导入到 main2.js 中。

然后您可以在 extract-text-webpack-plugin 上使用 [name] 占位符，它应该为每个入口点创建一个单独的输出文件：

plugins: [
    new ExtractTextPlugin('[name].css')
]

这应该会为您输出两个单独的 css 文件：main1.css 和 main2.css

希望这会有所帮助！

【讨论】：

嗨，我有 2 个 scss 文件，core.scss 和 core2.scss，但我有一个代码入口点 index.js。是否仍然可以有 2 个 css 文件，以便我可以同步加载另一个以异步模式加载？