Webpack React JSX Babel ES6 简单配置

确保安装正确的 npm 依赖项（babel 决定将自己拆分为一堆软件包，与对等依赖项有关）：

npm install webpack webpack-node-externals babel-core babel-loader babel-preset-react babel-preset-latest --save

webpack.config.js：

module.exports = {
    context: __dirname, // sets the relative dot (optional)
    entry: "./index.jsx",
    output: {
        filename: "./index-transpiled.js"
    },
    module: {
        loaders: [{
            test: /\.jsx$/,
            loader: "babel?presets[]=react,presets[]=latest" // avoid .babelrc
        }]
    }, // may need libraryTarget: umd if exporting as a module
    externals: [require("webpack-node-externals")()], // probably not required
    devtool: "inline-source-map"
};

webpack-node-externals 是一个扫描你的 node_modules 的函数，并确保它们不会与你的前端代码一起被转换和绑定，但它确保 bundle 保留对它们的引用。这有助于加快转换速度，因为你不会重新编码库。