react ES6+ sass 配置

package.json

{
  "name": "app",
  "version": "1.0.0",
  "description": "",
  "main": "app/main.jsx",
  "scripts": {
    "lint": "eslint 'app/**/*[email protected](js|jsx)'",
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack -p",
    "start": "webpack-dev-server --devtool eval --progress --colors",
    "deploy": "NODE_ENV=production webpack -p --config webpack.production.config.js",
    "validate": "npm ls"
  },
  "dependencies": {
    "classnames": "^2.2.1",
    "lodash": "^3.10.1",
    "react": "~0.14.3",
    "react-dom": "~0.14.3",
    "react-tap-event-plugin": "^0.2.1"
  },
  "devDependencies": {
    "autoprefixer": "^6.1.2",
    "babel-core": "~6.2.1",
    "babel-eslint": "~4.1.6",
    "babel-loader": "~6.2.0",
    "babel-plugin-transform-runtime": "~6.1.18",
    "babel-preset-es2015": "~6.1.18",
    "babel-preset-react": "~6.1.18",
    "babel-preset-stage-0": "~6.1.18",
    "babel-runtime": "~6.2.0",
    "css-loader": "~0.23.0",
    "eslint": "~1.10.1",
    "eslint-config-airbnb": "~1.0.0",
    "eslint-plugin-react": "~3.10.0",
    "extract-text-webpack-plugin": "^0.9.1",
    "open-browser-webpack-plugin": "0.0.1",
    "postcss-loader": "^0.8.0",
    "precommit-hook": "~3.0.0",
    "react-hot-loader": "^1.3.0",
    "sass-loader": "^3.1.2",
    "style-loader": "~0.13.0",
    "webpack": "~1.12.9",
    "webpack-dev-server": "~1.14.0"
  },
  "keywords": [
    "chongzhi"
  ],
  "author": "ruoguan",
  "license": "MIT",
  "pre-commit": [
    "lint"
  ]
}

webpack.config.js

var webpack = require('webpack');
var path = require('path');
var autoprefixer = require('autoprefixer');
var OpenBrowserPlugin = require('open-browser-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
    devServer: {
        historyApiFallback: true,
        inline: true,
        hot: true,
        contentBase: './app',
        host: '0.0.0.0',
        port: 8080
    },
    entry: [
        path.resolve(__dirname, 'app/main.jsx')
    ],
    output: {
        path: __dirname + '/build',
        publicPath: '/',
        filename: './bundle.js'
    },
    resolve: {
        extensions: ['', '.jsx', '.scss', '.js', '.json']
    },
    module: {
        loaders: [{
            test: /\.js[x]?$/,
            include: path.resolve(__dirname, 'app'),
            exclude: /node_modules/,
            loaders: ['react-hot-loader', 'babel-loader']
        },{
            test: /\.scss|\.css$/,
            include: path.resolve(__dirname, 'app'),
            loader: ExtractTextPlugin.extract("style", "css?sourceMap&modules&localIdentName=[local]-[hash:base64:5]!postcss!sass")
        }]
    },
    postcss: [autoprefixer],
    plugins: [
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false
            }
        }),
        new ExtractTextPlugin('main.css', {
            allChunks: true
        }),
        new webpack.HotModuleReplacementPlugin(),
        new OpenBrowserPlugin({
            url: 'http://localhost:8080'
        })
    ]
};