React 快速开始（环境搭建及脚手架配置）
- 全局安装 yarn： npm install -g yarn；
- 全局安装 react 官方脚手架 create-react-app： npm install -g create-react-app；
- 新建react项目（myapp）：create-react-app myapp；
注：myapp为项目名称； - 进入 react 项目根目录 myapp：cd myapp；
- 显示隐藏的配置文件：npm run eject；
- 安装项目默认的全部依赖：yarn 或者 yarn install；
注：此时已可以使用 yarn start 或者 npm start 启动项目了
项目会运行在 http://localhost:3000/
之后就是安装 react全家桶相关依赖了；
- 路由 react-router-dom：
- 英文文档：https://reacttraining.com/react-router/
- 中文文档（简书）：http://www.jianshu.com/p/e3adc9b5f75c/
- 安装命令：yarn add react-router-dom
- 状态管理 redux：
- 文档 : http://www.redux.org.cn/
- 安装：
需要先安装 redux（yarn add redux）
然后安装 react-redux（yarn add react-redux）
异步数据 redux-thunk （yarn add redux-thunk）
- 请求数据 fetch：
- 英文文档：https://github.com/github/fetch
- 中文文档：https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API
- 安装：yarn add whatwg-fetch
- css预处理器 sass：
安装：yarn add sass-loader node-sass
-
配置文件路径：config/webpack.config.dev.js config/webpack.config.prod.js
注：修改位置可通过搜索 oneOf 或者 exclude 来定位，增加内容如下：oneOf: [ { // 配置css预处理器sass test: /\.scss$/, loaders: ['style-loader', 'css-loader', 'sass-loader'], }, { exclude: [/\.(js|jsx|mjs)$/, /\.html$/, /\.json$/, /\.scss$/], // 排除sass文件 loader: require.resolve('file-loader'), options: { name: 'static/media/[name].[hash:8].[ext]', }, }, ],
-
设置开发环境代理（处理开发环境跨域）：
注：在package.json文件中添加字段proxy，开发环境下dev-server将会自动转发请求"proxy": "http://aaa.bbb.com/"
