webpack 打包 怎么把 sass 单独打包出来呢?
webpack打包 我如果想把css单独打出来的话 是用插件这样的
`
{test: /.css$/, loader: ExtractTextPlugin.extract("style", "css")}`
但是呢 如果我想把 用sass编写的样式也打包 转换成css 的时候也是单独的一个css 文件 ,应该怎样写配置呢?
写回答
-
IT从业1.首先引入extract-text-webpack-plugin和sass-loader
npm install --save-dev extract-text-webpack-plugin sass-loader
var ExtractTextPlugin = require('extract-text-webpack-plugin');
2.编写loaders
{
test: /.sass$/,
loader: ExtractTextPlugin.extract('style', 'css!sass')
}需要知道的是，ExtractTextPlugin.extract 第二个参数(或拆分为多个参数)中 loader 的执行顺序是从右到左，即先对引入的 .sass 使用 sass loader 得到编译后的 css 再使用 css-loader 按照正常 css-loader 的方式处理。
可以参考我开源的一个基本配置：https://github.com/guox191/React-mobile-example/blob/master/webpack.config.js
2019-07-17 19:35:43赞同 展开评论 打赏
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
