创建一个 React+Typescript 项目

接下来 我们来一起探索一下用TypeScript 来编写react

这也是一个非常好的趋势,目前也非常多人使用

那么 我们就先从创建项目开始

首先 我们先找一个 或者 之前创建一个目录 用来放我们的项目

然后 在这个目录下直接输入

例如 这里 我想创建一个叫 tsReApp 的项目就可以输入

javascript 复制代码
npx create-react-app tsreapp --template typescript

这个没办法 这个命令是不支持大写的 所以 名字就只好将大写部分换成小写了

然后 我们查看目录 发现项目就已经创建好了

这里 大家一定要搞清楚 npx的概念

他的意思是 如果你的项目中有执行这个命令需要的依赖 他就用依赖 如果没有 他就自己先将依赖装好 再创建

然后 我们聊个题外话

官方推荐我们使用 VSCode 一般前端电脑里应该都有 这个工具还是非常好用的

然后 我们用VSCode打开刚刚创建的项目

在 package.json 中 我们可以看到 启动命令是start

我们直接终端执行

javascript 复制代码
npm run start

然后 浏览器端 也正常起来了

但这个不得不承认 Ts项目的编译速度 会比ES项目会稍微慢一些

相关推荐
李明卫杭州24 分钟前
在 JavaScript 中,生成器函数(Generator Function)
前端·javascript
不会敲代码125 分钟前
React组件通信:从零开始掌握Props传递
react.js
Lethehong28 分钟前
从安装到实测:基于 Claude Code + GLM-4.7 的前端生成与评测实战
前端
恋猫de小郭34 分钟前
iOS + AI ,国外一个叫 Rork Max 的项目打算替换掉 Xcode
android·前端·flutter
宇木灵1 小时前
C语言基础-三、流程控制语句
java·c语言·前端
qq8406122331 小时前
Nodejs+vue基于elasticsearch的高校科研期刊信息管理系统_mb8od
前端·vue.js·elasticsearch
哆啦A梦15883 小时前
Vue3魔法手册 作者 张天禹 012_路由_(一)
前端·typescript·vue3
RaidenLiu4 小时前
别再手写 MethodChannel 了:Flutter Pigeon 工程级实践与架构设计
前端·flutter·前端框架
~央千澈~5 小时前
抖音弹幕游戏开发之第17集:添加日志系统·优雅草云桧·卓伊凡
linux·服务器·前端
JamesYoung79715 小时前
第一部分 — 基础知识 项目框架与文件布局
前端·chrome