我正在使用Webpack使用ReactJS和JSX代码构建一个非常简单的小型教程。我遇到了我不明白的错误。
Hash: 3646b1c9ad32c77ed791
Version: webpack 4.29.3
Time: 492ms
Built at: 02/14/2019 8:24:59 AM
1 asset
Entrypoint main = main.js
[0] ./src/index.js 223 bytes {0} [built] [failed] [1 error]
ERROR in ./src/index.js 6:12
Module parse failed: Unexpected token (6:12)
You may need an appropriate loader to handle this file type.
| render() {
| return (
> <h1>Hello world!</h1>
| )
| }
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! react@1.0.0 build: `webpack`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the react@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely
additional logging output above.
我的index.js文件只有以下内容:
import React from 'react';
class HelloThere extends React.Component {
render() {
return (
<h1>Hello world!</h1>
)
}
}
ReactDOM.render(
<HelloThere/>,
document.getElementById('content')
);
有人可以建议为什么Webpack版本显示错误吗?
编辑: 我的package.json:
{
"name": "react",
"version": "1.0.0",
"description": "react projects",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack"
},
"author": "John Doe",
"license": "ISC",
"babel": {
"presets": [
"react"
]
},
"devDependencies": {
"@babel/cli": "^7.2.3",
"@babel/core": "^7.2.2",
"@babel/preset-env": "^7.3.1",
"@babel/preset-react": "^7.0.0",
"babel-cli": "^6.26.0",
"babel-loader": "^8.0.5",
"babel-preset-env": "^1.7.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"webpack": "^4.29.3",
"webpack-cli": "^3.2.3"
},
"dependencies": {
"@babel/polyfill": "^7.2.5"
}
}
我的webpack.config.js:
module.exports = {
entry: "./src/index.js",
output: {
filename: "./dist/main.js"
}
};
非常感谢您帮助解决此问题。这可能是一个简单的问题。