使用React脚手架创建一个react项目

2022-06-23  本文已影响0人  Jycoding

使用脚手架创建项目

打开命令行窗口

执行命令

npx create-react-app react-basic

说明:

npx create-react-app 是固定命令,create-react-app是React脚手架的名称

react-basic表示项目名称,可以自定义,保持语义化

npx 命令会帮助我们临时安装create-react-app包,然后初始化项目完成之后会自自动删掉,所以不需要全局安装create-react-app

启动项目

yarn startornpm start

2. 项目目录说明调整

目录说明

src 目录是我们写代码进行项目开发的目录

package.json 中俩个核心库:react 、react-dom

目录调整

删除src目录下自带的所有文件,只保留app.js根组件和index.js

创建index.js文件作为项目的入口文件,在这个文件中书写react代码即可

入口文件说明

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

上一篇 下一篇

猜你喜欢

热点阅读