React脚手架

执行命令

$ npx create-react-app react-basic

相关说明:

• npx create-react-app 是固定命令，create-react-app是React脚手架的名称
• react-basic表示项目名称，可以自定义，保持语义化
• npx 命令会帮助我们临时安装create-react-app包，然后初始化项目完成之后会自自动删掉，所以不需要全局安装create-react-app

完成后启动脚手架项目

$ yarn start
or
$ npm start

项目目录说明

• 删除src目录下自带的所有文件，只保留app.js根组件和index.js
• 创建index.js文件作为项目的入口文件，在这个文件中书写react代码即可

入口文件说明

import React from 'react'
import ReactDOM from 'react-dom'
import './index.css'
// 引入根组件App
import App from './App'
// 通过调用ReactDOM的render方法渲染App根组件到id为root的dom节点上
ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById('root')
)