如何设置webpack.config以在Reactjs中使用jsx-html-class

Question

我已经通过jsx-html-class安装了npm个软件包，但我不确定如何修改我的webpack.config.js文件以便使用它。

var webpack = require("webpack");
var path = require("path");

module.exports = {
    context: path.join(__dirname, "src"),
    entry: "./js/index.js",
    module: { 
        loaders: [
            {
                test:/\.jsx?$/,
                exclude: "node_modules",
                loader: "babel-loader",
                query: {
                            presets:["react", "es2015", "stage-0"],
                            plugins:["transform-decorators-legacy", "jsx-html-class"]
                }
            }
     ]
    },
    output: {
        path: __dirname + "/src/",
        filename: "bundle.js"
    }
};

Answer 1

我解决了同样的问题：

npm install --save-dev babel-plugin-react-html-attrs

然后将此添加到您的webpack配置：

loaders: [{
    test: /\.js?$/,
    loader: 'babel-loader',
    query: {
        presets: ['react', 'es2015'],
        plugins: ['react-html-attrs']
    }
}]

或通过.babelrc

{
  "plugins": [
    "react-html-attrs"
  ]
}