Reactjs 为什么不是';babel在解析我的JSX吗?

Reactjs 为什么不是';babel在解析我的JSX吗?,reactjs,webpack,babeljs,Reactjs,Webpack,Babeljs,运行webpack时出现以下错误: Error in ./src/index.jsx Module parse failed: .../src/index.jsx Unexpected token (10:18) You may need an appropriate loader to handle this file type. 我相信我已经安装了所有正确的装载机,如果我遗漏了什么,请告诉我 package.json: "dependencies": { "isomorphic-fet

运行
webpack
时出现以下错误:

Error in ./src/index.jsx
Module parse failed: .../src/index.jsx Unexpected token (10:18)
You may need an appropriate loader to handle this file type.
我相信我已经安装了所有正确的装载机,如果我遗漏了什么,请告诉我

package.json:

"dependencies": {
  "isomorphic-fetch": "^2.2.1",
  "koa": "^1.2.4",
  "koa-ejs": "^3.0.0",
  "koa-route": "^2.4.2",
  "koa-router": "^5.4.0",
  "koa-static": "^2.0.0",
  "koa-webpack-dev-middleware": "^1.2.2",
  "node-sass": "^3.10.1",
  "react": "^15.3.2",
  "react-dom": "^15.3.2",
  "react-hot-loader": "^1.3.0",
  "react-redux": "^4.4.5",
  "react-router": "^2.8.1",
  "redux": "^3.6.0",
  "redux-thunk": "^2.1.0",
  "sass-loader": "^4.0.2",
  "style-loader": "^0.13.1",
  "webpack": "^1.13.2"
},
"devDependencies": {
    "babel-core": "^6.17.0",
    "babel-eslint": "^7.0.0",
    "babel-loader": "^6.2.6",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0",
    "babel-preset-stage-0": "^6.16.0",
    "babel-preset-react-hmre": "^1.1.1",
    "css-loader": "^0.25.0",
    "eslint": "^3.7.1",
    "eslint-loader": "^1.5.0",
    "eslint-plugin-react": "^6.4.1",
    "koa-webpack-hot-middleware": "^1.0.3",
    "react-hot-loader": "^1.3.0",
    "redux-devtools": "^3.3.1",
    "webpack-dev-server": "^1.16.2"
  }
webpack.config.js:

const webpack=require('webpack');
const path=require('path');
const ROOT_PATH=PATH.resolve(_dirname);
module.exports={
devtool:process.env.NODE_env==='production'?'''sourcemap',
条目:[
“webpack热中间件/客户端?路径=/\uuuuuWebpack\uHMR&timeout=20000”,
解析(根路径,'src/index.jsx')
],
模块:{
预紧器:[{
测试:/\.jsx?$/,,
加载程序:process.env.NODE_env==='production'?[]:['eslint'],
包括:path.resolve(根路径'src/index.jsx')
}],
装载机:[{
测试:/\.jsx?$/,,
排除:/node_模块/,
加载器:“巴贝尔”,
查询:{
预设:['es2015'、'stage-0'、'react'],
cacheDirectory:true,
环境:{
发展:{
预设:['react-hmre']
}
}
},
包括:“./src”
},
{
测试:/\.scss$/,,
加载器:['style','css','sass']
}]
},
决心:{
扩展名:['','.js','.jsx']
},
输出:{
路径:process.env.NODE_env==='production'
?路径解析(根路径,“dist”)
:path.resolve(根路径,'build'),
公共路径:“/”,
文件名:“bundle.js”
},
开发服务器:{
contentBase:path.resolve(根路径,'build'),
历史上的倒退:是的,
热:是的,
是的,
进展:正确
},
插件:[
新建webpack.optimize.OccurenceOrderPlugin(),
新建webpack.HotModuleReplacementPlugin(),
新的webpack.NoErrorsPlugin()
]
};
src/index.jsx:


运行
babel src/index.jsx确实可以按预期工作,因此我认为这是网页包配置的问题。

我的
include
js(x)加载程序的路径是错误的。固定使用

include: path.resolve(ROOT_PATH, './src')
而不是

include: './src'

根据babel loader配置中预设的顺序,我看到了一些奇怪的问题。您可以尝试“预设”:[“es2015”、“反应”、“阶段0”]?仍然是一个问题。FWIW我也尝试过使用.babelrc文件,但没有预设,这也不起作用。不过,运行
babelsrc/index.jsx确实有效。
include: path.resolve(ROOT_PATH, './src')
include: './src'