最新的react0.14支持ES6開發環境配置方案

最近研究facebook的React框架，結果發現不少文章和教程都是老的0.13版本的，而新的react多了個ReactDOM跟原來略有區別，通過屢次測試和修改，終於搭建成功。爲了支持es6開發，本身研究出了一個簡單的webpack配置，放在這，方便本身記憶，也讓新手少走彎路。
首先創建 package.json 配置，經過 npm install 安裝。

{
  "private": true,
  "scripts": {
    "dev": "webpack-dev-server --colors --inline --hot"
  },
  "devDependencies": {
    "babel-core": "^6.1.2",
    "babel-loader": "^6.1.0",
    "babel-preset-es2015": "^6.1.2",
    "babel-preset-react": "^6.1.2",
    "css-loader": "^0.22.0",
    "style-loader": "^0.13.0",
    "webpack": "^1.12.3",
    "webpack-dev-server": "^1.12.1"
  },
  "dependencies": {
    "react": "^0.14.2",
    "react-dom": "^0.14.2"
  }

而後創建 webpack.config.js,這個創建好，就能夠用 npm run dev 來啓動測試服務，支持熱更新，來爽快的開發了。

var webpack = require('webpack');
module.exports = {
    entry: [
      "./js/app.js"
    ],
    output: {
        path: './build',
        filename: "bundle.js"
    },
    module: {
        loaders: [
            { test: /\.js$/, exclude: /node_modules/, loader: 'babel?presets[]=es2015&presets[]=react'},
            { test: /\.css$/, loader: "style!css" }
        ]
    },
    resolve:{
        extensions:['','.js','.json']
    },
    plugins: [
      new webpack.NoErrorsPlugin()
    ]
};

代碼地址：點這裏