React基础学习(一):搭建环境和demo运行

本文介绍了如何搭建React开发环境,包括安装Node.js和npm(或cnpm),以及使用create-react-app创建并运行React项目。通过npm start启动项目后,将在浏览器中看到'Welcome to React'的页面,表明环境配置成功。
摘要由CSDN通过智能技术生成

1、安装node和npm(或者cnpm)

  • 安装node.js官网:https://nodejs.org/en/,npm包管理工具也会一同安装
  • Win+R 打开cmd命令行,输入 node -v 和 npm -v 或cnpm -v来查看版本号,如下图显示则安装完成。

Tips: npm作为包管理器来说相对来说比较好用,但是由于服务器不在国内所以有的时候速度会慢一点,建议安装一下淘宝团队的cnpm,这个就是npm在国内的镜像

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

在这里插入图片描述

2、构建并运行项目

安装create-react-app脚手架工具

cnpm install -g create-react-app

使用命令创建新的react项目 my-demo

create-react-app my-demo

进入项目my-demo目录,部署npm,导入react-dom依赖包

cd my-demo
npm init   (一路Enter)
npm install --save react react-dom  ( 在该目录下导入react和react-dom)
npm install --save  react-router-dom   (react路由,以后会用到)

通过 npm start 来启动项目,自动弹出localhost:3000的网页窗口,并显示Welcome to React则启动成功

cnpm start

之后每次Ctrl+s保存即可更新运行

1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看README.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。 1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看README.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。 1、资源项目源码均已通过严格测试验证,保证能够正常运行; 2、项目问题、技术讨论,可以给博主私信或留言,博主看到后会第一时间与您进行沟通; 3、本项目比较适合计算机领域相关的毕业设计课题、课程作业等使用,尤其对于人工智能、计算机科学与技术等相关专业,更为适合; 4、下载使用后,可先查看README.md或论文文件(如有),本项目仅用作交流学习参考,请切勿用于商业用途。 5、资源来自互联网采集,如有侵权,私聊博主删除。 6、可私信博主看论文后选择购买源代码。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值