1. 初始化

npm init vite

2. 输入项目名称

• vue3-ts

3. 选择vue

4. 选择typescript

5. 进入新建的项目

• cd vue3-ts

6. 安装依赖

• npm install

7. 运行

• npm run dev 或者 yarn dev

• 访问http://localhost:5173/

8. 安装路由

• yarn add vue-router -S

9. 安装element-plus

• yarn add element-plus -S

10. 安装自动导入组件插件

• yarn add unplugin-vue-components -D

11. 安装自动导入api插件

• yarn add unplugin-auto-import -D

12. 将./src变为@

• 下载@types/node依赖

npm i -D @types/node

• vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import path from 'path'// https://vitejs.dev/config/
export default defineConfig({plugins: [vue(),AutoImport({resolvers: [ElementPlusResolver()],}),Components({resolvers: [ElementPlusResolver()],}),],resolve: {alias: [{find: '@',replacement: path.resolve(__dirname, 'src')},],//extensions数组的意思是在import组件的时候自动补全.vue等文件后缀extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']}
})

• tsconfig.json

"compilerOptions": {"baseUrl": "./","paths": {"@/*": ["src/*"]}}

13. 安装pinia

• yarn add pinia -S