React脚手架的安装

全局安装create-react-app

$ npm install -g create-react-app

创建项目

$ create-react-app your-app（这里的your-app是你要创建的项目的名字）

临时安装

$ npx create-react-app your-app

这需要等待一段时间，这个过程实际上会安装三个东西

●react: react的顶级库

●react-dom: 因为react有很多的运行环境，比如app端的react-native, 我们要在web.上运行就使用react-dom

●react-scripts: 包含运行和打包react应用程序的所有脚本及配置

全局安装一次安装以后就不用安装了，但是需要及时手动更新，临时安装每次安装都装的是新的

react项目运行指令   npm start

打开power shell窗口    shift+鼠标右键

常见问题:

●npm安装失败

●切换为npm镜像为淘宝镜像

●使用yarn,如果本来使用yarn还要失败，还得把yarn的源切换到国内

●如果还没有办法解决,请删除node_ modules及 package-lock.json然后重新执行npm install命 令

●再不能解决就删除node_ modules及package-lock.json的同时清除npm缓存 npm cache clean --force之后再执行npm install 命令

//从react 的包当中引入了 React。只要你要写React.js 组件就必须引入React，因为react里有一种语法叫JSX，稍后会讲到JSX，要写JSX，就必须引入React

import React from ' react '

// ReactDOM可以帮助我们把React组件渲染到页面上去，没有其它的作用了。它是从react-dom中引入的，而不是从react引入。

import ReactDOM from ' react-dom'

// ReactDOM里 有一个render方法，功能就是把组件渲染并且构造DOM树，然后插入到页面上某个特定的元素上

ReactDOM. render (

//这里就比较奇怪了，它并不是一个字符串，看起来像是纯HTML代码写在Javascript 代码里面。语法错误吗?这并不是合法的Javascript 代码，“在JavaScript 写的标签的”语法叫JSX- JavaScript //XML

<h1>欢迎进入React的世界</h1>，

//渲染到哪里

    document. getE1 ementById(' root ' )

)