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

相关推荐
漂流瓶jz4 小时前
Webpack中各种devtool配置的含义与SourceMap生成逻辑
前端·javascript·webpack
前端架构师-老李4 小时前
React 中 useCallback 的基本使用和原理解析
前端·react.js·前端框架
木易 士心5 小时前
CSS 中 `data-status` 的使用详解
前端·css
明月与玄武5 小时前
前端缓存战争:回车与刷新按钮的终极对决!
前端·缓存·回车 vs 点击刷新
牧马少女5 小时前
css 画一个圆角渐变色边框
前端·css
zy happy5 小时前
RuoyiApp 在vuex,state存储nickname vue2
前端·javascript·小程序·uni-app·vue·ruoyi
小雨青年6 小时前
Cursor 项目实战:AI播客策划助手(二)—— 多轮交互打磨播客文案的技术实现与实践
前端·人工智能·状态模式·交互
小光学长6 小时前
基于Vue的儿童手工创意店管理系统as8celp7(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面。
前端·数据库·vue.js
meichaoWen6 小时前
【Vue】Vue框架的基础知识强化
前端·javascript·vue.js
jingling5556 小时前
Flutter | 基础环境配置和创建flutter项目
前端·flutter