经过yeoman建立React-webpack项目

说明

经过yo建立React项目, 而且学习React和Redux

---

环境要求

1. 环境要求 node js环境 ,请安装最新node js 版本
2. 打开cmd(win下)或者终端(mac & linux)执行npm -v 后能够看到显示版本号, 之后全部执行都是指在命令行或者终端下执行
3. 安装Yeoman 、Bower、Grunt 、Gulp，Mac下可能须要sudo 安装,执行下面命令 npm install -g yo bower grunt-cli

Yeoman安装和使用详解

---

构建一个项目

1. 执行 yo

2. 选择 Install a generator

3. 搜索关键字 react , 稍等片刻(根据网络环境)会出现一些列表, 选择安装 React Webpack

4. 退出yo, 建立一个目录, mkdir reactTest, 进入 cd reactTest

5. 执行yo, 选择React Webpack, 能够给project起名或者用默认的

6. 选择css语言, 默认便可

7. 是否打开 postcss , 根据需求选择 y or N

8. 而后等待项目自动构建, 此时会从网络下载相关的依赖库, 网络环境会影响时间

9. 当看到下面图案时就完成了, 若是错误能够删除node_modules文件夹, 而后执行 npm install 从新下载依赖

---

运行项目

1. npm run start 便可运行项目
2. 打开package.json, 能够看的scripts下的命令均可以运行, 功能如名称所示

---

ES6学习

在React和Redux的dome代码中会有涉及到ES6的语法, 能够在学习过程当中一并学习

---

React学习

1.建议直接学习官方的教程

React官方
中文React

2.教程里面的例子最好都跟着手敲一边, 不要拷贝粘贴, 有些例子中文中没法跑通, 官方能够

---

Redux学习

1.建议直接学习官方的教程

Redux官方
Redux中文

2.教程里面的例子最好都跟着手敲一边, 不要拷贝粘贴, 有些例子中文中没法跑通, 官方能够