react装置
React能够直接下载运用,下载包中也供应了许多进修的实例。
本教程运用了 React 的版本为 15.4.2,你能够在官网 http://facebook.github.io/react/ 下载最新版。
你也能够直接运用 BootCDN 的 React CDN 库,地点以下:
<script src="https://cdn.bootcss.com/react/15.4.2/react.min.js"></script>
<script src="https://cdn.bootcss.com/react/15.4.2/react-dom.min.js"></script>
<script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js"></script>
运用实例
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
<script src="https://cdn.bootcss.com/react/15.4.2/react.min.js"></script>
<script src="https://cdn.bootcss.com/react/15.4.2/react-dom.min.js"></script>
<script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.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>
react.min.js – React 的中心库 react-dom.min.js – 供应与 DOM 相干的功用
babel.min.js – Babel 能够将 ES6 代码转为 ES5 代码,如许我们就可以在现在不支撑 ES6 浏览器上实行 React
代码。Babel 内嵌了对 JSX 的支撑。经由过程将 Babel 和 babel-sublime
包(package)一同运用能够让源码的语法衬着上升到一个全新的程度。
运用 create-react-app 疾速构建 React 开辟环境
第一步、装置全局包
create-react-app 是来自于 Facebook,经由过程该敕令我们无需设置就可以疾速构建 React 开辟环境。
create-react-app 自动建立的项目是基于 Webpack + ES6 。
实行以下敕令建立项目:
$ cnpm install -g create-react-app
$ create-react-app my-app
$ cd my-app/
$ npm start
//项目目次
|____my-app
|____README.md
|____node_modules/
| |____package.json
|____.gitignore
|____public
| |____favicon.ico
| |____index.html
|____src
| |____App.css
| |____App.js
| |____App.test.js
| |____index.css
| |____index.js
| |____logo.svg
在浏览器中翻开 http://localhost:3000/ ,即可显现
上一篇:react开辟教程(-)初识
下一篇:react开辟教程(三)组件的构建