快速搭建一个Vue+TS+Vite项目

1、在一个文件夹下通过cmd打开,输入命令

npm create vite@latest

命名要为英文

2.选择项目框架

通过上下键位选择Vue框架:

选好按回车键

3.选择开发语言

选择TypeScript语言,方便后续开发:

创建好的项目目录为:

4.安装Vite依赖

接着在终端输入:

npm i

5.启动页面

终端接着输入:

npm run dev

访问效果:

6.目录结构解析

├── src

│ ├── assets/ # 静态资源

│ ├── components/ # 组件 (.vue + .ts)

│ ├── App.vue # 根组件(含类型检查)

│ ├── main.ts # TS 入口文件(挂载 Vue 应用)

│ └── vite-env.d.ts # Vite 类型声明

├── index.html # 主页面

├── tsconfig.json # TypeScript 配置

├── vite.config.ts # Vite 配置(TS 编写)

└── package.json # 包含 "type": "module"

相关推荐
m0_7381207211 小时前
CTFshow系列——命令执行web73-77(完结篇)
前端·安全·web安全·网络安全·ctfshow
呵阿咯咯11 小时前
前端开发典型问题解决方案:打包冲突、状态更新与性能优化
前端
前端搬运侠12 小时前
🚀 浏览器原理+网络知识面试必刷!50道高频面试题详解
前端
励扬程序12 小时前
Cloudflare workers 构建和部署无服务器功能、站点和全栈应用程序。
前端·全栈
YUJIANYUE12 小时前
纯前端html英文字帖图片生成器自动段落和换行
前端·html
给月亮点灯|12 小时前
Vue基础知识-Vue中v-cloak、v-text、v-html、v-once、v-pre指令详解
前端·javascript·vue.js
LHX sir12 小时前
低代码革命遇瓶颈?这个“套娃神技“才是破局关键!
前端·ui·前端框架·交互·团队开发·软件需求·极限编程
aiden:)12 小时前
Selenium WebUI 自动化“避坑”指南——从常用 API 到 10 大高频问题
开发语言·前端·javascript·python·selenium
掘金一周12 小时前
还在用html2canvas?介绍一个比它快100倍的截图神器!| 掘金一周 9.4
前端·人工智能