最近在学习React ES6的写法，遇到一个问题。
src/helloworld.js
import React, {
Component,
} from 'react';
import ReactDom from 'react-dom';
class HelloReact extends Component {
render() {
return (
<p> Hello React</p>
);
}
}
ReactDom.render(<HelloReact/>, document.getElementById('example'));index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
<script src="build/react.js"></script>
<script src="build/react-dom.js"></script>
<script src="https://npmcdn.com/babel-core@5.8.38/browser.min.js"></script>
</head>
<body>
<p id="example"></p>
<script type="text/babel" src="build/helloworld.js"></script>
</body>
</html>我用babel cli将helloworld.js转码后载入index.html。但是报错 require is not defined。
我看了下babel将src中的import转成了require。这么说难道我还要在index.html中载入require.js吗？
.babelrc
{
"presets": [
"es2015", "react"
],
"plugins": []
}
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
js模块化有AMD,CMD,UMD,CommonJS等，你用babel转换的js文件，是将es6的import转换为了es5的CommonJS规范的require，浏览器端是不支持CommonJS的（除非用工具入browserify），可以设置转换为AMD规范的模块化写法，再用requireJS，或者你也可以使用browserify。单最好的方式是使用Webpack，Webpack支持各种模块化规范，react开发必备