React 安装

通过CDN库构建 React 环境

使用 Staticfile CDN 的 React CDN 库，地址如下：

<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<!-- 生产环境中不建议使用 -->
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>

官方提供的CDN地址：

<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<!-- 生产环境中不建议使用 -->
<script src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"></script>

注意：如果我们需要使用 JSX，则 <script> 标签的 type 属性需要设置为 text/babel。

通过 npm 构建 React 环境

前提条件：安装Node >= 8.10 和 npm >= 5.6
设置淘宝镜像：

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
$ npm config set registry https://registry.npm.taobao.org

执行以下命令创建项目：

$ cnpm install -g create-react-app
$ create-react-app my-app
$ cd my-app/
$ npm start

项目的目录结构如下：

demo/
  README.md
  node_modules/
  package.json
  package-lock.json
  .gitignore
  public/
    favicon.ico
    index.html
    logo192.png
    logo512.png
    manifest.json
  src/
    App.css
    App.js
    App.test.js
    index.css
    index.js
    logo.svg
    serviceWorker.js
    setupTest-lock.json