React Install脚手架和创建项目

react脚手架

1)xxx脚手架: 用来帮助程序员快速创建一个基于xxx库的模板项目
a.包含了所有需要的配置
b.指定好了所有的依赖
c.可以直接安装/编译/运行一个简单效果
2)react提供了一个用于创建react项目的脚手架库: create-react-app
注意 node_global创建全局变量 通过npm root -g 查询根节点 或者找到全局变量位置
3)项目的整体技术架构为: react + webpack + es6 + eslint(代码规范)
4)使用脚手架开发的项目的特点: 模块化, 组件化, 工程化

创建项目并启动

//安装脚手架
npm i -g create-react-app
//创建项目 hello -react为项目名
create-react-app hello-react
//进入hello-react 文件夹
cd hello-react
//启动项目
npm start

##项目构建成功之后 执行命令 会自动打开浏览器 自动运行项目(如图)

停止项目:在cmd命令继续输入 按下ctrl+c 即可停止项目

react脚手架项目结构

ReactNews
|–node_modules—第三方依赖模块文件夹
|–public
|-- index.html-----------------主页面
|–scripts
|-- build.js-------------------build打包引用配置
|-- start.js-------------------start运行引用配置
|–src------------源码文件夹
|–components-----------------react组件
|–index.js-------------------应用入口js
|–.gitignore------git版本管制忽略的配置
|–package.json----应用包配置文件
|–README.md-------应用描述说明的readme文件

SPA single page application