react.js - webpack该怎么打包scss文件并且导出?
本文介绍了react.js - webpack该怎么打包scss文件并且导出?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
就是类似打包js文件这样,打包scss文件成一个css,然后html里面直接link引入,虽然知道用extract-text-webpack-plugin这个插件,但是我不知道entry和output该怎么写?这两个里面已经写了js了,怎么再单独写scss的?难道是module.exports导出两个对象?
解决方案
官网上的例子
// webpack.config.js
var ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
// The standard entry point and output config
entry: {
posts: "./posts",
post: "./post",
about: "./about"
},
output: {
filename: "[name].js",
chunkFilename: "[id].js"
},
module: {
loaders: [
// Extract css files
{
test: /\.css$/,
loader: ExtractTextPlugin.extract("style-loader", "css-loader")
},
// Optionally extract less files
// or any other compile-to-css language
{
test: /\.less$/,
loader: ExtractTextPlugin.extract("style-loader", "css-loader!less-loader")
}
// You could also use other loaders the same way. I. e. the autoprefixer-loader
]
},
// Use the plugin to specify the resulting filename (and add needed behavior to the compiler)
plugins: [
new ExtractTextPlugin("[name].css")
]
}
这篇关于react.js - webpack该怎么打包scss文件并且导出?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文