React_创建一个项目

目录

一、React(js 版)

二、React(ts 版) 


使用react创建一个项目,前提是确保你已经安装了Node.js和npm。

如果没有安装Node.js和npm,查看这个文件:

安装node.js和npmicon-default.png?t=N7T8https://blog.csdn.net/zxy19931069161/article/details/138838537?spm=1001.2014.3001.5501

一、React(js 版)

在命令行中运行以下命令来创建一个react项目:

npx create-react-app my-app

这里my-app是你的项目名称。现在进入项目目录:

cd my-app

启动开发服务器:

npm start

此时编辑器会自动打开浏览器运行项目。下图,左侧是项目目录,右侧是运行起来的项目。

   

二、React(ts 版) 

创建项目(使用 TypeScript 模板):

npx create-react-app my-app --template typescript

这里my-app是你的项目名称。现在进入项目目录:

cd my-app

启动开发服务器:

npm start

此时编辑器会自动打开浏览器运行项目。下图,左侧是项目目录,右侧是运行起来的项目。

    

 此时我们可以看到,ts为模板的React项目,他的文件后缀名为 .tsx  。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/749896.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

flask-socket的实践

1.长连接和短连接的由来 1)TCP在真正的读写操作之前,server与client之间必须建立一个连接, 当读写操作完成后,双方不再需要这个连接时它们可以释放这个连接, 连接的建立通过三次握手,释放则需要四次握手…

AGV叉车自动化存取货场景到底有哪些?

AGV 在各种新技术发展的今天,叉车越来越智能化,agv无人叉车作为工业自动化领域的不可或缺的搬运设备,被广泛应用于各个行业中,主要用来实现重复性搬运、搬运工作强度大、工作环境恶劣、环境要求高的领域,近些年&#x…

阿里云centos7.9 挂载数据盘 并更改宝塔站点根目录

一、让系统显示中文 参考:centos7 怎么让命令行显示中文(英文->中文)_如何在命令行中显示中文-CSDN博客 1、输入命令:locale -a |grep "zh_CN" 可以看到已经存在了中文包 2、输入命令:sudo vi…

本地项目上传到GitHub上(李豆)

本地项目上传到GitHub上(李豆) 准备工作: 本地需要有 git 也需要有一个 GitHub 账号 首先需要在 GitHub 新建一个空仓库 在想要上传项目的文件夹中使用 Git 命令操作 初始化: git init与 github 仓库进行链接 :git remote add origin …

java基于ssm+jsp 仓库智能仓储系统

1管理员功能模块 管理员登录,通过填写用户名、密码等信息,输入完成后选择登录即可进入智能仓储系统 ,如图1所示。 图1管理员登录界面图 智能仓储系统 ,在智能仓储系统可以查看个人中心、公告信息管理、员工管理、供应商管理、商…

Python期末模拟题库[python123题库]

期末模拟题库 一、单项选择题 1、下列关于Python语言的特点的说法中,错误的是()‪‬‪‬‪‬‪‬‪‬‮‬‪‬‫‬‪‬‪‬‪‬‪‬‪‬‮‬‫‬‪‬‪‬‪‬‪‬‪‬‪‬‮‬‫‬‮‬‪‬‪‬‪‬‪‬‪‬‮‬‪‬‮‬‪‬‪‬‪‬‪‬‪‬‮‬‪‬‪‬‪‬‪‬‪…

今天不看明天付费------中国AGI(人工智能)的发展趋势

深入解析了中国AGI(人工智能)的发展趋势,并清晰地展示了其市场分层结构。 ** 从下至上,AGI市场被划分为四个主要层级:基础设施层、模型层、中间层和应用层。 基础设施层作为最底层,为AGI的发展提供了坚实…

基于opencv的图像拼接

利用Python的OpenCV库实现了简单的图像拼接,示例 1. 图像拼接的基本原理 图像拼接主要包括以下几个步骤: 特征检测与匹配:首先,需要在待拼接的图像之间找到匹配的关键点或特征。OpenCV提供了如SIFT、SURF、ORB等特征提取器以及…

05 Pytorch 数据读取 + 二分类模型

05 Pytorch 数据读取 二分类模型05 Pytorch 数据读取 二分类模型05 Pytorch 数据读取 二分类模型 01 数据读取 DataLoader(set作为参数) 02 Dataset 从哪读,怎么读? 功能:数据从哪里读取? 如何读取…

Windows的内核对象

内核对象句柄特定于进程。 也就是说,进程必须创建 对象或打开现有对象以获取内核对象句柄。 内核句柄上的每个进程限制为 2^24。 但是,句柄存储在分页池中,因此可以创建的实际句柄数取决于可用内存。 可以在 32 位 Windows 上创建的句柄数明显低于 2^24。 任何进程都可以为…

苹果应用Testflight上架完整步聚

1.全部选中下图内容,包含iPhone与iPad屏幕所有旋转方向 2. 准备App图标,一定要有152和167这个尺寸,不然后提交不过 3.1024这个尺寸的的图像不能有透明层,不然提交不通过 4.选中编译设备为Any iOS Device[arm64] 5.选择Product下的Archive进行生成 6.在弹出的窗口中选择Test…

娱乐巨擘的员工新宠:工会数字平台塑造工作新风尚

当魔法城堡的灯光熄灭,超级英雄摘下头套,游乐园的职工们开始下班了。 乐园为游客送去了欢声笑语,员工却要在夜幕降临后面对一场心理戒断,而这一幕几乎每天都要上演。 不过,在全球知名影城度假区内,最近这…

视频技术朝着8K超高清方向发展,安防监控领域将迎来怎样变化?

一、背景 随着科技的日新月异,视频技术已逐渐成为我们日常生活中不可或缺的一部分。从娱乐、教育到安全监控,视频技术无处不在,并以其独特的方式影响着我们的生活方式。本文将探讨视频技术的发展趋势,并重点关注其在监控领域的应…

老板电器 45 年的烹饪经验,浓缩在这款烹饪大模型中

在科技不断进步的时代,人工智能(AI)迅速成为推动各行各业发展的重要力量。家电行业也不例外,根据 Gartner 的报告预测,到 2024 年,AI 家电市场的规模将达到万亿美元级别。这一预估凸显了智能化在家电行业中…

计算机组成原理(二)——数据的表示和运算

二、数据的表示和运算 2.1 数制与编码 2.1.1进位计数制 十进制计数法 有0~9,共10种符号,逢十进一 r进制计数法 基数:每个数码位所用到的不同符号的个数,r进制的基数为r 二进制:0,1 ①可使用两个稳定状态的物理器件表示 ②0,1正…

【移动应用开发期末复习】第五/六章例题

系列文章 第一章——Android平台概述 第一章例题 第二章——Android开发环境 第二章例题 第三章 第三章例题 第四章 第五/六章 系列文章RadioGroup 是一个Android特有的布局容器,用于包含多个RadioButton组件。当用户选择其中一个RadioButton时,RadioGroup会自动取消其他Rad…

po文件并转换成mo文件

po文件转换成mo文件 简介 .po和.mo文件是WordPress中语言相关的两种文件。po 是Portable Object(可移植对象)的缩写,存放待翻译的字符串信息,可直接用文本编辑器打开编辑;mo 是Machine Object的缩写,二进制文件,程序…

OverTheWire Bandit 靶场通关解析(上)

介绍 OverTheWire Bandit 是一个针对初学者设计的网络安全挑战平台,旨在帮助用户掌握基本的命令行操作和网络安全技能。Bandit 游戏包含一系列的关卡,每个关卡都需要解决特定的任务来获取进入下一关的凭证。通过逐步挑战更复杂的问题,用户可…

word图题表题公式按照章节编号(不用题注)

预期效果: 其中3表示第三章,4表示第3章里的第4个图。标题、公式编号也是类似的。 为了达到这种按照章节编号的效果,原本可以用插入题注里的“包含章节编号” 但实际情况是,这不仅需要一级标题的序号是用“开始->多级列表”自动…

积分的可视化

积分的可视化 flyfish 考虑平方根函数 f ( x ) x f(x) \sqrt{x} f(x)x ​,其中 x ∈ [ 0 , 1 ] x \in [0, 1] x∈[0,1] 。在区间 [ 0 , 1 ] [0, 1] [0,1] 上,函数 f f f 下方的面积是指函数 y f ( x ) y f(x) yf(x) 的图像与 x x x 轴之间的部…