创建一个 React+Typescript 项目

接下来 我们来一起探索一下用TypeScript 来编写react
在这里插入图片描述
这也是一个非常好的趋势,目前也非常多人使用
那么 我们就先从创建项目开始

首先 我们先找一个 或者 之前创建一个目录 用来放我们的项目
在这里插入图片描述
然后 在这个目录下直接输入
例如 这里 我想创建一个叫 tsReApp 的项目就可以输入

npx create-react-app tsreapp --template typescript

这个没办法 这个命令是不支持大写的 所以 名字就只好将大写部分换成小写了
在这里插入图片描述
然后 我们查看目录 发现项目就已经创建好了
这里 大家一定要搞清楚 npx的概念
他的意思是 如果你的项目中有执行这个命令需要的依赖 他就用依赖 如果没有 他就自己先将依赖装好 再创建
在这里插入图片描述
然后 我们聊个题外话
官方推荐我们使用 VSCode 一般前端电脑里应该都有 这个工具还是非常好用的
在这里插入图片描述
然后 我们用VSCode打开刚刚创建的项目
在 package.json 中 我们可以看到 启动命令是start
在这里插入图片描述
我们直接终端执行

npm run start

在这里插入图片描述
然后 浏览器端 也正常起来了
在这里插入图片描述
但这个不得不承认 Ts项目的编译速度 会比ES项目会稍微慢一些

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

浅谈早期基于模板匹配的OCR的原理

基于模板匹配的概念是一种早期的字符识别方法,它基于事先准备好的字符模板库来与待识别字符进行比较和匹配。其原理如下: 1. 字符模板库准备:首先,针对每个可能出现的字符,制作一个对应的字符模板。这些模板可以手工创…

最新版本的Anaconda环境配置、Cuda、cuDNN以及pytorch环境一键式配置流程

本教程是最新的深度学习入门环境配置教程,跟着本教程可以帮你解决入门深度学习之前的环境配置问题。同时,本教程拒绝琐碎,大部分以图例形式进行教程。这里我们安装的都是最新版本~ 文章目录 一、Anaconda的安装1.1 下载1.2 安装1.3 环境配置…

日常BUG——使用Long类型作id,后端返回给前段后精度丢失问题

😜作 者:是江迪呀✒️本文关键词:日常BUG、BUG、问题分析☀️每日 一言 :存在错误说明你在进步! 一、问题描述 数据库long类型Id: 前端返回的Id实体类: Data ApiModel("xxx") public class …

【C/C++】STL queue 非线程安全接口,危险!

STL 中的 queue 是非线程安全的,一个组合操作:front(); pop() 先读取队首元素然后删除队首元素,若是有多个线程执行这个组合操作的话,可能会发生执行序列交替执行,导致一些意想不到的行为。因此需要重新设计线程安全的…

【5款登录验证校验】基于jquery实现的5款登录验证码组件(附完整源码)

文章目录 写在前面涉及知识点1、随机字母验证码1.1 效果1.2 实现源码 2、数字运算验证码2.1 效果2.2 实现源码 3、滑块验证码3.1 效果3.2 实现源码 4、图片补全验证码4.1 效果4.2 实现源码 5、顺序点选验证码5.1 效果5.2 实现源码 6、源码分享6.1 百度网盘6.2 123网盘6.3 邮箱留…

新手开抖店多久可以出单?

​开抖店是一种越来越流行的创业方式,在社交媒体平台上开店销售各种商品,比如服装、配饰、美妆和家居用品等等。对于新手来说,他们可能会很关心自己开抖店能够多久出单。虽然这个问题没有一个固定的答案,但是以下是一些关键的运营…

openeuler服务器 ls 和ll 命令报错 command not found...

在openeuler服务器执行 ls 和ll 命令报错 command not found... 大概是系统环境变量导致的问题。 我在安装redis是否没有安装成功后就出现了这样的情况。编辑profile文件没有写正确,导致在命令行下ls 和 ll 等命令不能够识别。 重新设置一下环境变量。 export PAT…

ARM(汇编指令)

.global _start _start:/*mov r0,#0x5mov r1,#0x6 bl LoopLoop:cmp r0,r1beq stopsubhi r0,r0,r1subcc r1,r1,r0mov pc,lr*/ mov r0,#0x1mov r1,#0x0mov r2,#0x64bl Loop Loop:cmp r0,r2bhi stopadd r1,r1,r0add r0,r0,#0x01mov pc,lr stop:B stop.end

什么是层叠上下文(stacking context)?它是如何形成的?

聚沙成塔每天进步一点点 ⭐ 专栏简介⭐ 层叠上下文(Stacking Context)是什么?⭐ 层叠上下文的形成⭐ 写在最后 ⭐ 专栏简介 前端入门之旅:探索Web开发的奇妙世界 记得点击上方或者右侧链接订阅本专栏哦 几何带你启航前端之旅 欢迎…

LLaMA长度外推高性价比trick:线性插值法及相关改进源码阅读及相关记录

前言 最近,开源了可商用的llama2,支持长度相比llama1的1024,拓展到了4096长度,然而,相比GPT-4、Claude-2等支持的长度,llama的长度外推显得尤为重要,本文记录了三种网络开源的RoPE改进方式及相…

939. 最小面积矩形;2166. 设计位集;2400. 恰好移动 k 步到达某一位置的方法数目

939. 最小面积矩形 核心思想:枚举矩形的右边那条边的两个点,并用一个哈希表存储相同纵坐标的最近出现的列的列数,不断更新最近出现的左边那条边。 2166. 设计位集 核心思想:这题主要是时间复杂度的优化,用一个flag来标记当前翻转…

【Visual Studio Code】--- Win11 安装 VS Code 超详细

Win11 安装 VS Code 超详细 概述一、下载 Vscode二、安装 Vscode 概述 一个好的文章能够帮助开发者完成更便捷、更快速的开发。书山有路勤为径,学海无涯苦作舟。我是秋知叶i、期望每一个阅读了我的文章的开发者都能够有所成长。 一、下载 Vscode Vscode官网 二、…