uniapp+vue3+Ts(小兔仙项目)

本文主要是介绍uniapp+vue3+Ts(小兔仙项目)，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

一. 项目起步

拉取模块代码：

git clone -b template https://gitee.com/heima-fe/uniapp-shop-vue3-ts.git heima-shop

注意：

小程序真机预览需在 manifest.json 中添加微信小程序的 appid

引入 uni-ui 组件库

安装uni-ui组件库

pnpm i @dcloudio/uni-ui

配置自动导入组件

// pages.json
{// 组件自动导入"easycom": {"autoscan": true,"custom": {// uni-ui 规则如下配置  "^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue" }},"pages": [// …省略]
}

安装类型声明文件

pnpm i -D @uni-helper/uni-ui-types

配置类型声明文件

// tsconfig.json
{"compilerOptions": {// ..."types": ["@dcloudio/types", // uni-app API 类型"miniprogram-api-typings", // 原生微信小程序类型"@uni-helper/uni-app-types", // uni-app 组件类型"@uni-helper/uni-ui-types" // uni-ui 组件类型  ]},// vue 编译器类型，校验标签类型"vueCompilerOptions": {"nativeTags": ["block", "component", "template", "slot"]}
}

小程序端 Pinia 持久化

说明：Pinia 用法与 Vue3 项目完全一致，uni-app 项目仅需解决持久化插件兼容性问题。

持久化存储插件

安装持久化存储插件： 

这篇关于uniapp+vue3+Ts(小兔仙项目)的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---