React特点
Declarative（声明式编码）
Component-Based (组件化编码)
高效的DOM Diff 算法,最小化页面重绘
单向数据流
- React 生态：React、React-Router、Redux、Axios、 Babel、Webpack
React 脚手架配置开发环境
-
普通方式
npm install -g create-react-app
create-react-app my-app(项目目录)
cd my-app
npm start
-
官方方式 (需要Node>= 6和npm >= 5.2)
npx create-react-app my-app(项目目录)
cd my-app
npm start
官方解释 npx 命令：第一行的npx并不是一个打印错误——它是npm 5.2+附带的一个包运行器工具。
以下是 npx create-react-app my-app2 运行过程
可以看到以下是通过yarn来运行项目 。yarn是新一代包管理工具,相比npm更高效
yarn add v1.13.0 yarn版本
yarn start 项目本地运行命令
yarn build 项目打包命令
yarn test 启动测试项目
yarn eject 开放配置文件
D:\NodeProject>npx create-react-app my-app2
npx: installed 1 in 9.405s
Path must be a string. Received undefined
npx: installed 63 in 23.755s
C:\Users\Administrator\AppData\Roaming\npm-cache\_npx\11088\node_modules\create-react-app\index.js
Creating a new React app in D:\NodeProject\my-app2.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
yarn add v1.13.0
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@1.2.7: The platform "win32" is incompatible with this module.
info "fsevents@1.2.7" is an optional dependency and failed compatibility check. Excluding it from installat
ion.
info fsevents@1.2.4: The platform "win32" is incompatible with this module.
info "fsevents@1.2.4" is an optional dependency and failed compatibility check. Excluding it from installat
ion.
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
warning Your current version of Yarn is out of date. The latest version is "1.15.2", while you're on "1.13.
0".
info To upgrade, run the following command:
$ curl --compressed -o- -L https://yarnpkg.com/install.sh | bash
success Saved 5 new dependencies.
info Direct dependencies
├─ react-dom@16.8.5
├─ react-scripts@2.1.8
└─ react@16.8.5
info All dependencies
├─ fork-ts-checker-webpack-plugin@1.0.0-alpha.6
├─ react-dev-utils@8.0.0
├─ react-dom@16.8.5
├─ react-scripts@2.1.8
└─ react@16.8.5
Done in 236.63s.
Initialized a git repository.
Success! Created my-app2 at D:\NodeProject\my-app2
Inside that directory, you can run several commands:
yarn start
Starts the development server.
yarn build
Bundles the app into static files for production.
yarn test
Starts the test runner.
yarn eject
Removes this tool and copies build dependencies, configuration files
and scripts into the app directory. If you do this, you can’t go back!
We suggest that you begin by typing:
cd my-app2
yarn start
Happy hacking!
