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

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

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" 
    } 
};

来源

2016-12-13 Gabriel West

不要你的意思是'jsx-html-class'？ https://www.npmjs.com/package/jsx-html-class。也......你真的*真的需要这个吗？只要写'className' – azium

我的不好，我的意思是'jsx-html-class'，这实际上是我下载的包。我不是绝对需要它，但宁愿让它更容易阅读，现在我只想知道如何才能知道。 –

当你尝试运行webpack时，你得到的错误是什么？ –

我解决了这个同样的问题：

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" 
    ] 
}

来源

2017-09-07 09:50:20 booboos

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

回答

相关问题