项目模板使用说明

本模板是基于 UniApp + Vue3 + TypeScript 的小程序项目模板，提供了一些常用的工具和规范。

目录结构

├── api/                    # 接口相关
│   ├── modules/           # 模块化 API 请求
│   └── request.ts         # 请求封装配置
├── common/                # 公共资源
│   ├── styles/            # 全局样式
│   └── utils/             # 工具函数
├── components/            # 公共组件
├── lib/                   # 第三方库
├── mixins/                # Vue 混入
├── pages/                 # 主包页面
├── store/                 # 状态管理
├── uni_modules/           # uni-app 组件库
├── uview-plus/            # uView-Plus 组件库
├── App.vue               # 应用入口
├── main.ts               # 主入口文件
├── pages.json            # 页面路由和配置
├── manifest.json         # 应用配置
├── uni.scss              # 全局样式变量
└── .env                  # 环境变量配置

使用方法

将模板目录复制到您的项目目录下
根据需要修改 package.json 中的项目名称和描述
使用 npm install 安装依赖
根据需要修改 pages.json 中的页面配置
开始开发新功能

项目重要配置说明

核心依赖包

UniApp: 跨平台开发框架
Vue3: 渐进式 JavaScript 框架
TypeScript: JavaScript 超集，提供类型检查
uView-Plus: UI 组件库
z-paging: 分页组件
Vuex: 状态管理
luch-request: 网络请求库
dotenv: 环境变量注入

样式

common.css: 全局基础样式，包含codefun原子类
base.scss: SCSS 变量和 mixins，提供常用的样式类生成器

工具函数 (tool.ts)

alert: 文字轻提示
loading/hideLoading: 显示/隐藏加载提示
页面跳转方法: navigateTo, redirectTo, reLaunch, switchTab, navigateBack
本地缓存操作: storage, removeStorage, getStorageInfo
copy: 复制文本到剪贴板
saveImageToPhotos: 保存图片到相册
requestPayment: 微信支付
upload: 文件上传
loadFont: 加载外部字体

配置文件

App.vue: 全局样式引入和基础设置
main.ts: Vue 应用初始化和全局组件注册
pages.json: 页面路由和窗口表现配置
manifest.json: 应用配置（appid等）
uni.scss: 全局 SCSS 变量
.env: 环境变量配置
vite.config.js: Vite 构建配置

开发注意事项

实际项目开发中请根据需要修改或扩展功能函数
项目中的配置可根据具体需求进行修改和替换
请遵循项目中已有的代码规范和风格
样式文件可参考项目中的规范进行编写
网络请求统一使用 api/request.ts 中封装的 luch-request
工具函数统一在 common/utils/tool.ts 中维护
环境变量通过 .env 文件进行配置，构建时会自动替换 manifest.json 中的 appid

3.0 KiB Raw Blame History Unescape Escape

项目模板使用说明

目录结构

使用方法

项目重要配置说明

核心依赖包

样式

工具函数 (tool.ts)

配置文件

开发注意事项

3.0 KiB

Raw Blame History