搭建react开发环境的步骤-蒲公英云

搭建react开发环境的步骤

一：安装node可，以在官网或者中文网里面下载，根据自己的电脑选择是32还是64

网址：http://nodejs.cn

format_png

二：下载并安装好node之后，打开docs管理工具，先看看node安装成功了没有，输入 node -v ，回车，会输出node的版本号，

这样就已经是安装成功了，由于在国内使用npm是非常慢的，所以在这里我们推荐使用淘宝npm镜像，使用

淘宝的cnpm命令管理工具可以代替默认的npm管理工具：

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

三：安装react脚手架，cmd执行 cnpm i -g create-react-app (-g为全局下载)

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpbWluZzEwMTY_size_16_color_FFFFFF_t_70

四：安装好 node 和 react脚手架后就可以创建项目啦，cmd切换至指定路径，执行 npx create-react-app myproject 回车，myproject为自定义项目名，最后出现 happy hacking说明创建成功。

上图报错，可以使用npx执行

注意: npx这不是一个错字 - 它是一个包装运行工具，附带npm 5.2+。

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpbWluZzEwMTY_size_16_color_FFFFFF_t_70 1

五：项目创建成功后，我们可在对应的路径下看到项目文件。打开文件可以看到文件结构。

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpbWluZzEwMTY_size_16_color_FFFFFF_t_70 2

六：启动项目。在项目所在路径下，在命令行输入： npm start 回车即可

3000是默认的端口，要访问的话，直接在浏览器输入localhost:3000就可以打开默认的模板了

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpbWluZzEwMTY_size_16_color_FFFFFF_t_70 3

搭建react开发环境的步骤