楼主刚开始学习react框架（完全的前端小白）在搭建环境这一关都花了不少时间。（还是得多亏同学的帮助，带我走出了困境，看到了希望）所以在此总结一下。
一、 通过npm使用React
1、node.js的安装。
如果你的系统不支持Node.js及NPM，则下载Node.js安装包及源码
如果你和我一样是windows 64位系统，那和我一样按如下选择：
你可以根据不同平台系统选择你需要的Node.js安装包。
Windows 安装包(.msi)
安装步骤1：双击下载后的安装包，如下图所示：
步骤2：点击以上的Run(运行)，将出现如下界面，点击next进入下一个界面：
步骤3：勾选接受协议选项，点击”Next“进入下一步：
步骤4：Node.js默认安装目录为”C:、Program File\nodejs\“，你可以修改目录，并点击next(下一步)：
步骤5：点击树形图标来选择你需要的安装模式，然后点击下一步（next）
步骤6;点击install（安装）开始安装Node.js。你也可以点击Back(返回)来修改先前配置。然后点击next:直到安装结束：
步骤7：检测是否已经成功安装node.js ：点击cmd，输入node -v 如果可以查看当前Node.js版本，则说明node.js安装成功。
目前的node.js都自带npm的。所以无需安装npm
2、React中使用CommonJS模块系统，如browserify或webpack，本教程使用webpack。
国内使用npm速度较慢，你可以使用淘宝定制的cnpm命令行工具代替默认的npm：
在这里，你可以进入自己定义的某个文件路径下，执行命令，否则默认是在C盘下。
如：我选择的是
D:\\install\nodeinstall\ npm install -g cnpm --registry=https://registry.npm.taobao.org
D:\\install\nodeinstall\ npm config set registry https://registry.npm.taobao.org
ps:补充： 这样就可以使用cnpm 命令来安装模块了：
cnpm install [模块名]
更多信息查阅：https://npm.taobao.org/.
3、使用create-react-app快速构建React开发环境
create-react-app 是来自于Facebook,通过该命令我们无需配置就能快速构建React开发环境。
create-react-app 自动创建的项目是基于webpack +ES6
进入项目目录创建项目：
安装目录 cnpm install -g create -react -app
安装目录 create-react-app my-app
cd my-app/
npm start
即可在浏览器中打开https://localhost:3000/ ，结果如下图所示：
配置成功！下面可以进入项目编写你的代码吧！
如对本文有疑问， 点击进行留言回复！！
我要评论
网友评论