react学习(一)安装以及基本配置学习

一、搭建新工程

参考：https://facebook.github.io/react/docs/installation.html

npm install -g create-react-app//npm安装create-react-app

create-react-app my-app//使用create-react-app搭建手脚架

cd my-app//进入项目根目录

npm run start//启动项目

 

二、工程目录

1.生成的目录如下：

2.package.json:该文件是一个json对象，常用字段有

参考：http://javascript.ruanyifeng.com/nodejs/packagejson.html

（1）scripts：指定了运行脚本命令的npm命令行缩写

（2）dependencies，devDependencies：前者指定项目运行的必须依赖，后者指定项目开发环境的依赖。使用npm install --save安装的依赖信息保存在dependencies字段中，使用npm install --dev-save保存在devDependencies中。另外可以在这两个字段中写好依赖，在同级目录中运行npm install即可安装项目所需依赖。

（3）config用于添加命令行的环境变量

（4）bin：指定内部命令对应的可执行文件的位置

 

三、npm run start工作流程

npm run start ->

根目录的package.json，scripts的start的值react-scripts start ->

bin react-scripts指定的./bin/react-scripts.js->

[require.resolve('../scripts/' + script)].concat(args)->

start.js->

const config = require('../config/webpack.config.dev');参考webpack配置https://webpack.js.org/->

start.js开启服务，监听端口，本例子中，默认端口3000->

使用localhost:3000访问服务即可

 

 

 

git：https://github.com/bingoAO/h5/blob/master/react%E5%AD%A6%E4%B9%A0/installation/README.md