创建一个文件夹

输入cmd命令

pnpm创建vite：pnpm create vite

确保有提前安装pnpm，如果没有输入“npm i -g pnpm”全局安装

输入项目名称

选择vue框架

选择ts语法

是否使用实验性功能，用于替代传统打包工具，目前处于开发阶段，所以选择“No”;

选择“Yes”安装依赖，后面也可以使用“pnpm i”安装

运行后就可以使用连接打开

解决报红问题

找不到模块“./App.vue”或其相应的类型声明。ts(2307)

这是typescript只能理解.ts文件，无法理解.vue文件，需要在src文件目录下添加后缀.d.ts的扩展文件

/// <reference types="vite/client" />
declare module '*.vue' {
    import type { DefineComponent } from 'vue'
    // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
    const component: DefineComponent<{}, {}, any>
    export default component
}

tsconfig.app.json文件的内容标红

TypeScript 要求在使用 tsBuildInfoFile 时，必须同时启用 incremental 或 composite 选项。

erasableSyntaxOnly表示"仅可擦除语法模式"。当设置为 true 时，编译器或工具只会处理那些可以被安全移除或替换的语法结构，而不会影响代码的实际功能和运行时行为，删除对代码无影响。

noUncheckedSideEffectImports启用TypeScript的"无未检查副作用导入"检查。当设置为true时，TypeScript会确保所有没有导入任何内容的导入语句都必须有明确的副作用说明，删除对代码无影响。

tsconfig.node.json文件的内容标红