node安装:

(一)安装Node.js、npm、cnpm

           当我们在官网下载并安装Node时,npm也自动安装好了,一路next后即可。安装好后键入node -v 以及npm -v 来测试是否安装成功(不需要自己手动配置系统环境变量)

           

React前端开发环境搭建_地址栏

          因为国内使用npm很慢,我们可以使用淘宝的cnpm,同时设置镜像地址

          npm install -g cnpm --registry=https://registry.npm.taobao.org

React前端开发环境搭建_react环境搭建_02

安装成功后,可以键入cnpm -v检查是否安装成功

React前端开发环境搭建_react环境搭建_03

(二)创建我们的第一个react程序

例如我们要在D:\workSpace下创建first-react-demo这个工程,并跑通,我们依次执行如下步骤

 

window下进入D:\workSpace这个文件夹,在地址栏键入cmd enter,

React前端开发环境搭建_地址栏_04

 

cnpm install -g create-react-app   全局安装创建react-app的module(这一步不一定要在workspace目录下)

React前端开发环境搭建_ci_05

 create-react-app first-react-demo  在workspct这个文件夹下创建fist-react-demo这个项目

React前端开发环境搭建_ci_06

但是,有可能会报错 Unexpected end of JSON input while parsing near '....0","dependencies":{"' ,假如报错,需要执行npm cache clean --force

React前端开发环境搭建_ci_07

在创建成功的基础上,我们在打开first-react-demo这个文件夹,地址栏键入cmd并enter,在打开的cmd窗口中,键入npm start

React前端开发环境搭建_ci_08

大功告成。浏览器键入localhost:3000即可访问

React前端开发环境搭建_react环境搭建_09