一、 开发环境的准备
- 确保已经安装过Node,这里具体方法不赘述
- 用脚手架创建App
1)进入react的官网:React官网,点击‘Get Started’按钮- 点击右侧‘Create a New React App’后跳转页面
3)依次运行三个命令
- 点击右侧‘Create a New React App’后跳转页面
- 项目运行后显示如下:
二、工程目录 - .gitignore: 配置不想上传到git上的文件
-
node_modules: 项目依赖的所有第三方类库(npm install / yarn install之后自动生成)
-
public下的favicon.ico: 控制网页tab左上角的小图标
-
public下的index.html:项目对应的页面内容
-
src下的index.js:整个项目的入口文件
三、精简代码 -
精简App.js如下:
function App() {
return (
<div>
Hello world
</div>
);
}
export default App;
- 删除App.css文件
- 删除manifest.json文件
- 去掉index.html中的如下代码
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
四、代码分析:
此行代码表示:通过该行代码把App.js生成的文本挂载到页面上id=root的标签上,之后页面上才能展示出内容