# uniapp-v3

**Repository Path**: sgy135/uniapp-v3

## Basic Information

- **Project Name**: uniapp-v3
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-09-18
- **Last Updated**: 2025-09-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

站在巨人的肩膀上 [unibest](https://unibest.tech/)
技术栈： `uniapp` + `Vue3` + `Ts` + `Vite5` + `UnoCss` + `wot-ui` + `z-paging` + `alova` 构成，使用了最新的前端技术栈，无需依靠 `HBuilderX`，通过命令行方式运行 `web`、`小程序` 和 `App`（编辑器推荐 `VSCode`，可选 `webstorm`）。

[alova](https://alova.js.org/)

[wot-ui](https://wot-design-uni.netlify.app/)
[UnoCss](https://unocss.dev/interactive/)

## ⚙️ 环境

- node>=18
- pnpm>=7.30
- Vue Official>=2.1.10
- TypeScript>=5.0
- 建议使用 node 22.13.0  pnpm 10.10.0

## 快速开始

执行 `pnpm i` 安装依赖
执行 `pnpm dev` 运行 `H5`
执行 `pnpm dev:mp` 运行 `微信小程序`

## 📦 运行（支持热更新）

- web平台： `pnpm dev:h5`, 然后打开 [http://localhost:9000/](http://localhost:9000/)。
- weixin平台：`pnpm dev:mp` 然后打开微信开发者工具，导入本地文件夹，选择本项目的`dist/dev/mp-weixin` 文件。
- APP平台：`pnpm dev:app`, 然后打开 `HBuilderX`，导入刚刚生成的`dist/dev/app` 文件夹，选择运行到模拟器(开发时优先使用)，或者运行的安卓/ios基座。

## 🔗 发布

- web平台： `pnpm build:h5`，打包后的文件在 `dist/build/h5`，可以放到web服务器，如nginx运行。如果最终不是放在根目录，可以在 `manifest.config.ts` 文件的 `h5.router.base` 属性进行修改。
- weixin平台：`pnpm build:mp`, 打包后的文件在 `dist/build/mp-weixin`，然后通过微信开发者工具导入，并点击右上角的“上传”按钮进行上传。
- APP平台：`pnpm build:app`, 然后打开 `HBuilderX`，导入刚刚生成的`dist/build/app` 文件夹，选择发行 - APP云打包。

## 关于开发注意事项

### 新建页面

1. 得益于 [@uni-helper/vite-plugin-uni-pages](https://github.com/uni-helper/vite-plugin-uni-pages),约定式路由（文件路由）的实现轻而易举。
2. 只需要在 src/pages和 pages-sub 新建.vue文件，插件会自动生成对应的 pages.json 文件。
3. route 代码块则可以配置页面相关信息，这些信息会自动同步到 page.json，无需切换到 page.json 进行配置。
4. pages.json 文件是自动生成的，请不要手动修改，全局的东西请在 pages.config.ts 里面配置，页面上的东西请在 vue 文件的 route 代码块配置。

### 关于组件

1. 基础组件是与业务无关的组件，在封装时请勿将跟业务相关的逻辑或代码封装至组件内。
2. 在src/components 新建 v-XXXX命名的文件夹以及.vue文件