【笔记】使用Vite搭建Vue3(TypeScript版本)项目

Question

如题所述

Answer 1

使用Vite搭建Vue的TypeScript版本的时候，可以使用 Vite自带的模板预设 —— vue-ts 。

执行命令行 ：

执行命令行(安装最新版本)：

router.ts

执行命令行(安装最新版本)：

Vuex 没有为 this.$store 属性提供开箱即用的类型声明。如果你要使用 TypeScript，首先需要声明自定义的 模块补充(module augmentation) 。

为此，需要在项目文件夹中添加一个声明文件来声明 Vue 的自定义类型 ComponentCustomProperties 。

vuex.d.ts

当使用组合式 API 编写 Vue 组件时，您可能希望 useStore 返回类型化的 store。为了 useStore 能正确返回类型化的 store，必须执行以下步骤：

store.ts

main.ts

在 main.ts 已经声明配置过Vuex和Vue-Router之后，在 <script setup lang="ts"> 或者 <script lang="ts"> 中按需导入 store 和 router 即可使用其属性和方法。

router.ts