4-4 webpack的配置-react 浏览器报错 :Uncaught ReferenceError: ReactDOM is not defined
来源:4-4 Webpack配置(1)
慕田峪6302525
2018-05-21
4-4 webpack的配置-react 用webpack-dev-server预览 浏览器报错 :Uncaught ReferenceError: ReactDOM is not defined,但我的各项配置都跟老师一样,安装了react reacrt-dom并且app.jsx也引入了! 求解大神!!
app.jsx
import React from 'react';
// react-dom
import ReactDom from 'react-dom';
// CSS
import './index.css';
// SASS
import './index.scss';
// font-awesome 字体
import 'font-awesome/css/font-awesome.min.css';
ReactDOM.render(
<h1>Hello, world!</h1>,
document.getElementById('app')
);webpack.config.js
{
test: /\.jsx$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options:{
presets : ['env', 'react']
}
}
}]package.json
"dependencies": {
"bootstrap": "3.3.7",
"font-awesome": "4.7.0",
"prop-types": "15.6.0",
"rc-pagination": "1.14.0",
"react": "16.2.0",
"react-dom": "16.2.0",
"react-router-dom": "4.2.2",
"simditor": "2.3.6"
}发现打包出来的app.js中 ReactDOM没有转换成_reactDom2,不知道为什么
打包出来的app.js
var _react = __webpack_require__(6);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(18);
var _reactDom2 = _interopRequireDefault(_reactDom);
__webpack_require__(29);
__webpack_require__(30);
__webpack_require__(31);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
// SASS
// react-dom
ReactDOM.render(_react2.default.createElement(
'h1',
null,
'Hello, world!'
), document.getElementById('app'));写回答
1回答
-
慕田峪6302525
提问者
2018-05-21
我发现 就是
import ReactDom from 'react-dom';
和
ReactDOM.render()
中 ReactDOM
大小写不一致。改一样就行了。。醉了 粗心大意012018-05-25