尝试使反应与webpack一起工作,但在dev工具控制台中获得错误“app.js:105 Uncaught TypeError:(0,_reactDom2.default)不是函数”
文件webpack.config.js:
module.exports = {
entry: [
__dirname + '/assets/react/pages/app.js'
],
output: {
path: __dirname + '/public/z_output/',
filename: 'app.js'
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['react', 'es2015']
}
}
]
}
};
文件app.js:
import React from 'react';
import ReactDOM from 'react-dom';
class App extends React.Component {
render(){
return(
<h1>aa</h1>
)
}
}
ReactDOM(<App />, document.getElementById('app'));
UPDATE Package.json添加了File package.json:
{
"name": "kioe",
"version": "1.0.0",
"private": true,
"scripts": {
"start": "node ./kioe.js"
},
"dependencies": {
"react": "^15.1.0",
"react-dom": "^15.1.0",
},
"devDependencies": {
"babel-core": "*",
"babel-loader": "*",
"babel-preset-es2015": "*",
"babel-preset-react": "*",
"webpack": "*"
}
}
您是否尝试将“stage-0”添加到预设数组中以进行babel-loader修复?此外,你需要npm install --save-dev babel-preset-stage-0。
你应该也使用ReactDOM.render,而不仅仅是ReactDOM。
您也可以为babel-loader的presets数组添加“stage-2”,你需要安装依赖babel-preset-stage-2 - > npm install --save-dev babel-preset-stage-2 in App.js或index.js
import React from 'react'
import { render } from 'react-dom'
class App extends React.Component {
render(){
return(
<h1>aa</h1>
)
}
}
render(<App />, document.getElementById('app'));