Webpack模块构建失败的意外令牌（rails反应构建）

我正在进行react / rails构建，并首次使用webpack和babel。 我正在使用两个文件并收到错误 ：

错误在./app/assets/frontend/main.jsx中
模块构建失败：
SyntaxError：/Users/cls/GitHub/rails_react/app/assets/frontend/main.jsx：意外的令牌（6：6）

第6行是：

这是main.jsx文件 

 import Greet from './greet'; class Main extends React.Component { render() { return (  ); } } let documentReady = () => { React.render( , document.getElementById('react') ); }; $(documentReady);

这是greet.jsx文件： 

 export default class Greet extends React.Component { render() { return 
Hello There
 } }

这是我的webpack.config： 

 module.exports = { entry: "./app/assets/frontend/main.jsx", output: { path: __dirname + "/app/assets/javascripts", filename: "bundle.js" }, resolve: { extensions: ['', '.js', '.jsx'] }, module: { loaders: [ { test: /\.jsx$/, loader: "babel-loader" } ] } };

我没有babelrc文件？

首先确保使用解决方案在解决方案中安装react，babble和其他依赖项 

  npm install react --save

然后在web pack配置文件中请在query包含类似于下面的presets ： 

  module.exports = { entry: 'main.jsx', output: { // Output the bundled file. path: './src', // Use the name specified in the entry key as name for the bundle file. filename: 'bundle.js' }, module: { loaders: [{ test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel', query: { presets: ['react'] } }] }, externals: { // Don't bundle the 'react' npm package with the component. 'react': 'React' }, resolve: { // Include empty string '' to resolve files by their explicit extension // (eg require('./somefile.ext')). // Include '.js', '.jsx' to resolve files by these implicit extensions // (eg require('underscore')). extensions: ['', '.js', '.jsx'] } };

因此，在给出所有反馈的情况下，我能够弄明白。 谢谢所有回答的人。

这是我需要做的：

npm install babel-preset-es2015

npm install babel-preset-react

并创建一个.babelrc文件（ 感谢azium和Kreozot ） 

 `{ "presets": [ "react", "es2015" ] }`

我想我们正在观看Samer Buna的“Rails上的React.js：构建一个完整的堆栈Web应用程序”

为了解决这个问题我安装了这个模块：

npm install react --save

npm install babel-preset-es2015

npm install babel-preset-react

我正在使用此配置https://jsfiddle.net/daronwolff/11tgotvz/

感谢@ milad-rezazadeh和@chrissavage

Interesting Posts