Webpack sass在哪里的CSS文件

我正在使用像这样的sass加载器的networking包：

module.exports = { module: { loaders: [ { test: /\.scss$/, loader: "style!css!sass" } ] } }; 

但我看到风格适用于样式标记，生成CSS文件在哪里？

Answer 1

默认情况下，样式加载器将编译后的CSS内联到您的包中，该包通过输出文件（例如bundle.js添加到页面的头部。 使用extract-text-webpack-plugin，你可以从bundle中删除已编译的CSS，并将其导出到一个单独的文件中。

首先 – 将你的装载器包装在插件中：

  loaders: [{ test: /\.scss$/, loader: ExtractTextPlugin.extract( "style", "css!sass") }] }, 

然后告诉插件调用它生成的文件：

 plugins: [ new ExtractTextPlugin("app.css") ] 

通常在HTML中包含这个文件。

Answer 2

如果您在使用Webpack时需要单独的CSS文件，则需要使用extract-text-webpack-plugin 。