前提:已安装部署好nodejs环境

查看nodejs是否安装以及版本

1,win+r输入cmd打开命令行页面

2,路径换到nodejs目录

3,输入node -v查看版本

创建项目

1,win+r输入cmd打开命令行页面

2,路径换到工作空间目录下

3,输入创建命令,等待创建完成

4,创建成功

5,跳转到新建的项目路径下,并启动项目

6,项目启动成功后会自动打开浏览器页面,默认端口3000

7,项目目录结构

8,修改默认端口

修改package.json中的内容


"scripts": {
"start": "react-scripts start",
},
修改为
"scripts": {
"start": "set PORT=9000 && react-scripts start",
},

9,编辑工具使用的Visual Studio Code

在此工具中启动项目

ctrl+数字1左边的按键,出现以下页面,然后输入npm start

启动成功后依然自动打开浏览器

另有命令:npm stop / npm restart

创建第一个react项目的更多相关文章

  1. React环境配置(第一个React项目)

    使用Webpack构建React项目 1. 使用NPM配置React环境 NPM及React安装自行百度 首先创建一个文件夹,the_first_React 进入到创建好的目录,npm init,然后 ...

  2. 从零开始搭建一个react项目

    Nav logo 120 发现 关注 消息 4 搜索 从零开始搭建一个react项目 96 瘦人假噜噜 2017.04.23 23:29* 字数 6330 阅读 32892评论 31喜欢 36 项目地 ...

  3. react 工程起步 安装chrome 开发调试工具 react developer tools 及初建一个react 项目...

    1.安装react 开发工具 1.下载    chrome      react developer tools 下载地址:https://pan.baidu.com/s/1eSZsXDC  下载好是 ...

  4. 用Kotlin创建第一个Android项目(KAD 01)

    原文标题:Create your first Android project using Kotlin (KAD 01) 作者:Antonio Leiva 时间:Nov 21, 2016 原文链接:h ...

  5. 3.创建第一个android项目

    安卓开发学习笔记 1.安卓开发之环境搭建 2.SDK目录结构和adb工具及命令介绍 3.创建第一个android项目 1.打开Eclipse,选择File——>new——>others.. ...

  6. 创建第一个Maven项目

    -----------------------siwuxie095                                     创建第一个 Maven 项目         1.打开 Ec ...

  7. 使用IntelliJ IDEA创建第一个Mawen项目

    咳咳...首先各位在学习SSM框架的时候,单个单个学完之后,老夫掐指一算(其实,我是个小鲜肉),各位必定会去整合SSM,这个时候,老夫又掐指一算,各位必定会碰到个mawen的东西,在这里,我可以告诉各 ...

  8. 如何架构一个 React 项目?

    编程有点像搞园艺.比起竭力去对付BUG(虫子),我们更愿意把一切弄得整洁有序,以免最后落得个身在荒野丛林中.低劣的架构会拖我们的后腿,也会使得BUG更容易钻进系统里去. 想要对你的项目进行架构,方法有 ...

  9. Node.js npm基础安装配置&创建第一个VUE项目

    使用之前,我们先来明白这几个东西是用来干什么的. node.js: 一种javascript的运行环境,能够使得javascript脱离浏览器运行.Node.js的出现,使得前后端使用同一种语言,统一 ...

随机推荐

  1. IDEA报错Plugin "XXX" was not loaded: required plugin "Java EE: EJB, JPA, Servlets" is disabled.

    Java项目转Web项目 把java项目转成web项目时,发现Facets点击+号没有出现web选项. 经查询发现是插件没有正常加载导致的. 解决方案 1.没找到其他原因,重启即可. 2.我的是插件没 ...

  2. 修改docker容器参数

    创建容器时没有添加参数  --restart=always ,导致的后果是:当 Docker 重启时,容器未能自动启动. docker container update --restart=alway ...

  3. excel 宏循环行数据 ,Excel统计所有sheet数据行数 VBA

    Sub fun1() '统计每一个sheet有多少行数据 Set s1 = Sheets("Sheet1") 'totalok = 0 To Sheets.Count s1.Cel ...

  4. Java 之 HashSet 集合

    一.概述 java.util.HashSet  是 Set 接口的一个实现类,它所存储的元素是不可重复的,并且元素都是无序的(即存取顺序不一致). java.util.HashSet 底层的实现是一个 ...

  5. python爬虫爬取天气数据并图形化显示

    前言 使用python进行网页数据的爬取现在已经很常见了,而对天气数据的爬取更是入门级的新手操作,很多人学习爬虫都从天气开始,本文便是介绍了从中国天气网爬取天气数据,能够实现输入想要查询的城市,返回该 ...

  6. MyCat教程四:实现读写分离

    本文我们来给大家介绍下通过MyCat来实现MySQL的读写分离操作 MyCat读写分离 一.读写分离配置   前面我们已经介绍过了mysql的主从同步和mycat的安装及相关配置文件的介绍,现在我们来 ...

  7. Linux系统的时间比北京时间慢12个小时的处理方案(将EDT时区改为CST)

    今天查看Linux操作系统的时间,发现比正常时间慢12个小时整,感觉很奇怪,后来使用ntp服务器校对时间发现也是不管用的,还是慢12个小时.之前遇到过是慢8个小时,但是我知道是因为使用的是UTC时间, ...

  8. PAT甲级1013题解——并查集+路径压缩

    题目分析: 本题初步浏览题目就知道是并查集的模板题,数据输入范围N为1~1000,则M的范围为0~1000^2,通过结构体记录每一对连线的关系,p[]数组记录每个节点的跟,对于k次查询,每次都要重新维 ...

  9. Pytorch并行计算:nn.parallel.replicate, scatter, gather, parallel_apply

    import torch import torch.nn as nn import ipdb class DataParallelModel(nn.Module): def __init__(self ...

  10. vue router 中,children 中 path 为空字符串的路由,是默认打开的路由(包括在 el-tabs 中嵌套路由的情况)

    详见该页面的最后一个代码块:https://router.vuejs.org/zh/guide/essentials/nested-routes.html#%E5%B5%8C%E5%A5%97%E8% ...