这篇文章是怎么顺利运行第一个react代码。
最好的学习资源：阮一峰的React 入门实例教程
react中文网
准备工作：node环境、全局安装bower、安装git
step1.
- 在桌面建项目文件夹
- 打开命令黑窗口，cd切换到项目文件夹内。
bower install react 安装react
bower install babel 安装jsx解释器- 两个都安装好之后，在项目文件夹中会有一个bower_components文件夹包含react和babel文件夹。
- 用sublime打开项目文件夹→建index.html文件→在body里最下面引入三个js文件。
<script src="bower_components/react/react.js"></script>
<script src="bower_components/react/react-dom.js"></script>
<script src="bower_components/babel/browser.min.js"></script>
如果要使用 JSX，则 <script> 标签的 type 属性需要设置为 text/babel即为：
<script type="text/babel">js代码</script>react.js - React 的核心库，主要包含了React的相关方法的定义
react-dom.js - 提供与 DOM 相关的功能，是将我们定义的组件插入到html文档中
browser.min.js - 用于将 JSX 语法转为 JavaScript 语法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>hello React</title>
<script src="bower_components/react/react.js"></script>
<script src="bower_components/react/react-dom.js"></script>
<script src="bower_components/babel/browser.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel">
ReactDOM.render(
<h1>Hello, world!</h1>,
document.getElementById('example')
);
</script>
</body>
</html>运行一下试试吧。
4468
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
