使用Webpack在React JS中实时重新加载SCSS

时间:2016-05-01 05:44:04

标签: javascript reactjs webpack

我想问一下是否有一种方法可以将.scss文件编译为.css包含在webpack热重载中,我总是运行npm run build将我的.scss转换为.css

这是我的webpack.config:

var autoprefixer = require('autoprefixer');
var ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
    entry: './app/main.js',
    output: {
        path: './',
        filename: 'index.js'
    },
    devServer: {
        inline: true,
        port: 3333
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                exclude: '/node_modules/',
                loader: 'babel',
                query: {
                    presets: ['es2015','react']
                }
            },
            {
                 test: /\.scss$/,
                 loader: ExtractTextPlugin.extract("style-loader", "css-loader!sass-loader")
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin('[name].css',{
            allChunks: false
        })
    ],
    postcss: [
        autoprefixer({
          browsers: ['last 2 versions']
        })
    ]
}

0 个答案:

没有答案