创建一个 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项目会稍微慢一些

相关推荐
花间相见7 分钟前
【终端效率工具01】—— Yazi:Rust 编写的现代化终端文件管理器,告别繁琐操作
前端·ide·git·rust·极限编程
|晴 天|16 分钟前
我如何用Vue 3打造一个现代化个人博客系统(性能提升52%)
前端·javascript·vue.js
风止何安啊24 分钟前
网页都知道要双向握手才加载!从 URL 到页面渲染,单向喜欢连 DNS 都解析不通
前端·javascript·面试
太极OS30 分钟前
给 AI Skill 做 CI/CD:GitHub + ClawHub + Xiaping 同步发布实战
前端
你_好30 分钟前
Chrome 内置了 AI 工具协议?WebMCP 抢先体验 + 开源 DevTools 全解析
前端·mcp
GISer_Jing31 分钟前
LangChain.js + LangGraph.js 前端AI开发实战指南
前端·javascript·langchain
幺风33 分钟前
Claude Code 源码分析 — 核心对话循环
typescript·ai编程
正在发育ing__34 分钟前
从源码看vue的key和状态错乱的patch
前端
木心术136 分钟前
TypeScript实战进阶:从基础类型到高级类型编程
javascript·ubuntu·typescript
黄林晴1 小时前
第一次听到 Tauri 这个词,去学习一下
前端