基于 vue3 的 uniapp 开发模板

vue3-uniapp-template

简介

vue3-uniapp-template 是基于 vue3 的 uniapp 快速开发模板，包含状态管理、网络请求、路由拦截、UI组件、国际化、Token无感刷新、接口签名等常用功能。

主要使用的技术栈：uniapp、vue3、pinia、vite、uv-ui 。

下载地址

PS：如果对你有帮助的话，点个Star支持下哈~

Github
Gitee

项目启动

# 克隆代码
git clone https://github.com/cshaptx4869/vue3-uniapp-template.git

# 切换目录
cd vue3-uniapp-template

# 安装 pnpm
npm install pnpm -g

# 安装依赖
pnpm install

# 启动HBuilderX运行项目

效果预览

目录结构

vue3-uniapp-template
├─ .editorconfig
├─ .env.development					// 运行环境变量
├─ .env.production					// 发行环境变量
├─ .prettierignore
├─ api								// 接口管理
│  ├─ index.js
│  └─ modules						// 接口模块化
│     ├─ auth.js
│     └─ user.js
├─ App.vue
├─ commitlint.config.js
├─ components						// 项目组件库
│  ├─ LangSelect					// 语言切换组件
│  │  └─ LangSelect.vue
│  └─ ScanCode						// h5扫一扫组件
│     └─ ScanCode.vue
├─ hooks							// hooks管理
│  └─ usePermission.js				// 登录鉴权hook
├─ index.html
├─ LICENSE
├─ lint-staged.config.js
├─ locale							// 国际化管理
│  ├─ en.json
│  ├─ index.js
│  ├─ ja.json
│  ├─ uni-app.ja.json
│  ├─ zh-Hans.json
│  └─ zh-Hant.json
├─ main.js
├─ manifest.json
├─ package.json
├─ pages							// 页面管理
│  ├─ index
│  │  └─ index.vue
│  └─ login
│     └─ login.vue
├─ pages.json						// 页面路由
├─ pagesA							// 分包A页面管理
│  └─ test
│     └─ test.vue
├─ plugins							// 插件管理
│  ├─ http.js						// 请求响应拦截
│  ├─ i18n.js						// 国际化
│  ├─ index.js
│  ├─ router.js						// 路由拦截
│  ├─ store.js						// 状态管理
│  └─ ui.js							// UI扩展配置
├─ prettier.config.js
├─ README.md
├─ static							// 静态资源管理
│  └─ logo.png
├─ store							// store管理
│  ├─ index.js
│  └─ modules						// store模块化
│     ├─ auth.js
│     └─ user.js
├─ uni.scss
├─ utils							// 工具管理
│  └─ cache.js						// 缓存管理工具
└─ vite.config.js