一、前提

  首先保证node.js已安装完成...

  安装完成后,打开cmd命令行,输入 node -v 和 npm -v 来查看版本号,如果显示则安装完成。

二、安装react脚手架

  在cmd命令行中输入:  npm install -g create-react-app  等待其安装

  

三、新建React项目

  创建项目默认安装在用户目录下,想更换目录可以参照如下命令:

     在cmd命令行中输入: d:   (选择D盘)

    在cmd命令行中输入:cd d:\reactDemo   (进入D盘中的指定文件夹)

  

  执行新建项目命令:create-react-app my-new-app      (“my-new-app”是你的项目根目录文件夹名称)

  

  继续等待较长时间....切记...莫慌莫慌

四、安装淘宝cnpm命令

   npm获取有些耗时间,这里建议大家使用淘宝团队的cnpm

   在cmd命令行中输入:  npm install -g cnpm --registry=https://registry.npm.taobao.org

  

   输入cnpm -v输入是否正常  没报错,说明已经安装成功了

  

五、安装所需要的依赖包

   在cmd命令行中输入: cd d:\reactDemo\ my-new-app  (进入你新建的项目文件路径)

   

   继续cmd如下:

    npm init   (然后一路回车)

    cnpm install --save react react-dom       ( 使用淘宝cnpm命令 在该目录下导入react和react-dom)

    cnpm install --save  react-router-dom   (使用淘宝cnpm命令 react路由,以后会用到)

   继续waiting......

六、启动项目

   确认cmd目录在你的项目根目录路径下:d:\reactDemo\ my-new-app

   启动项目:npm start    启动后会自动弹出localhost:3000的网页窗口

   想关闭项目的话,直接关闭CMD窗口就可以,或者使用 Ctrl+C ,输入Y后退出

  

React项目搭建及依赖安装的更多相关文章

  1. React项目搭建与部署

    React项目搭建与部署 一,介绍与需求 1.1,介绍 1.1.1,React简介 React 是一个用于构建用户界面的 JAVASCRIPT 库. React主要用于构建UI,很多人认为 React ...

  2. react项目搭建及webpack配置

    1,配置webpack npm install -g webpack                       webpack的cli环境 npm install -g webpack-dev-se ...

  3. 基于webpack的React项目搭建(一)

    前言 工欲善其事,必先利其器.为了更好的学习React,我们先简要的把开发环境搭建起来.本文主要介绍使用webpack搭建React项目,如果你对React或es6的基础语法还不了解,建议先去学习学习 ...

  4. mac odoo 12 虚拟环境搭建及 依赖安装

    经过这几天的折腾,odoo 12 的虚拟环境总算搭建成了.网站有很多虚拟环境相关的搭建,但是都是写文章的自己清楚,但是文章里却描述不清楚. odoo 虚拟环境 这次搭建环境使用 odoo 12.0. ...

  5. 基于webpack的React项目搭建(三)

    前言 搭建好前文的开发环境,已经可以进行开发.然而实际的项目中,不同环境有着不同的构建需求.这里就将开发环境和生产环境的配置单独提取出来,并做一些简单的优化. 分离不同环境公有配置 不同环境虽然有不同 ...

  6. 基于webpack的React项目搭建(二)

    前言 前面我们已经搭建了基础环境,现在将开发环境更完善一些. devtool 在开发的过程,我们会经常调试,so,为了方便我们在chrome中调试源代码,需要更改webpack.config.js,然 ...

  7. react 项目搭建

    1.首先运行环境-node是必须的,需要下载安装node的运行环境: 2.安装好了node之后,自然的就有了npm: 3.npm install -g creact-react-app/全局安装cre ...

  8. React项目搭建基于Karma的CI环境

    简介 在浏览Github的时候是否经常看到这样的CI图标呢? 本文即为介绍如何为基于React的项目配置CircleCI的自动化测试环境 源码在此 本地实现 项目依赖如下: "devDepe ...

  9. React项目搭建(脚手架)

    首先我们需要安装node环境:download nodejs:https://i.cnblogs.com/EditPosts.aspx?opt=1 找到你需要的版本和系统安装包下载并安装. 这时候你可 ...

随机推荐

  1. Nginx实现负载均衡(nginx + tomcat应用分布式)

    一.       工具   nginx-1.8.0 apache-tomcat-6.0.33 二.    目标   实现高性能负载均衡的Tomcat集群: 三.    步骤   1.首先下载Nginx ...

  2. 【源码系列】Eureka源码分析

    对于服务注册中心.服务提供者.服务消费者这个三个主要元素来说,服务提供者和服务消费者(即Eureka客户端)在整个运行机制中是大部分通信行为的主动发起者(服务注册.续约.下线等),而注册中心主要是处理 ...

  3. 未能载入软件包“WebDriverAgentRunner”,因为它已损坏或丢失必要的资源。

    添加 YYCache.framework RoutingHTTPServer.framework

  4. Codeforces 1132D(二分模拟)

    要点 二分显然,关键在于怎么判断 题解方法:开k个队列代表每个时间有哪些电脑会挂掉,这部分O(n)预处理一下,之后扫一遍时间,每个时间点贪心选取最靠前的会挂的电脑未雨绸缪给它充电,然后看看充电以后要不 ...

  5. [POJ1463] Strategic game

    题目链接: 传送门 题目大意: Bob非常享受玩电脑游戏的过程,尤其是策略游戏,但是在有些时候,他因为不能在第一时间找到最佳的策略而十分伤心. 现在,他遇到了一个问题.他必须保卫一个中世纪的城市,有很 ...

  6. 洛谷 P1169||bzoj1057 [ZJOI2007]棋盘制作

    洛谷P1169 bzoj1057 这个题目跟最大全0子矩阵是类似的.正方形的话,只要把任意极大子正方形(”极大“定义见后面的”论文“)当成把某个极大子矩形去掉一块变成正方形即可,容易解决. 解法1:看 ...

  7. 关于childNodes和children

    1.childNodes. 会把注释.空文本.非空文本.标签都当做节点. 2.children: 在IE8以后的版本只会找到标签元素.不包括文本.空文本.注释.在IE8以前的版本会找到标签元素和注释, ...

  8. CSS入门使用

    声明标签 HTML <!DOCTYPE> 内链样式表 <body style="background-color:green;margin:0;padding:0;&quo ...

  9. wireshark工具集

    tshark 查看pcap文件第一个包的时间,当文件名不包含时间信息时非常有帮助 tshark -c 1 -T fields -e frame.time -r test.pcap dumpcap ed ...

  10. hdu4027Can you answer these queries?(线段树)

    链接 算是裸线段树了,因为没个数最多开63次 ,开到不能再看就标记.查询时,如果某段区间被标记直接返回结果,否则继续向儿子节点更新. 注意用——int64 注意L会大于R 这点我很纠结..您出题人故意 ...