ly-uni-scaffold

uni-app 三端统一脚手架 CLI 工具 — 一键生成支持 Android / iOS / HarmonyOS NEXT 的项目

快速开始

方式一：npx（推荐）

npx ly-uni-scaffold init my-app
cd my-app
npm install

方式二：全局安装

npm install -g ly-uni-scaffold
ly-uni-scaffold init my-app
cd my-app
npm install

在 HBuilderX 中运行

1. 打开 HBuilderX（推荐 5.04+）
2. 文件 → 导入 → 从本地目录导入 → 选择生成的项目目录
3. 运行 → 运行到浏览器（H5 开发调试）
4. 运行 → 运行到手机或模拟器（App 开发调试）
5. 发行 → 原生 App-云打包（正式打包）

命令行运行（可选）

# H5 开发模式
npm run dev:h5

# 各平台构建
npm run build:h5
npm run build:app-android
npm run build:app-ios
npm run build:app-harmony

生成的项目结构

my-app/
├── index.html                    # H5 入口
├── package.json                  # 依赖配置
├── vite.config.js                # Vite 构建配置
├── env/                          # Vite 环境变量
│   ├── .env.dev
│   ├── .env.sit
│   ├── .env.uat
│   └── .env.pro
└── src/
    ├── main.js                   # 应用入口 (Vue3 createSSRApp)
    ├── App.vue                   # 根组件
    ├── pages.json                # 路由 + easycom + tabBar
    ├── manifest.json             # 三端打包配置 (vueVersion: 3)
    ├── uni.scss                  # 全局主题变量
    ├── config/                   # 多环境配置 (DEV/SIT/UAT/PRO)
    ├── store/                    # Pinia 状态管理 (user/auth/app)
    ├── utils/                    # 工具库 (request/http/tools/validate)
    ├── core/                     # 核心服务 (crypto/sign/auth/event-bus)
    ├── platform/                 # 平台抽象层 (detect/push/permission/upgrade)
    ├── router/                   # 路由守卫
    ├── directives/               # 自定义指令 (v-permission)
    ├── api/                      # API 层 (模块自动加载)
    ├── components/               # 公共组件 (easycom 自动注册)
    ├── pages/                    # 页面 (login/home/me/demo)
    └── uni_modules/              # UTS 原生插件模板

技术栈

| 技术 | 版本 | 说明 | |------|------|------| | Vue | 3.4+ | Composition API / Options API | | @dcloudio/uni-app | 3.0.0-alpha-5000420260319001 | 匹配 HBuilderX 5.04 | | Vite | 5.x | 构建工具 | | Pinia | 2.x | 状态管理 + unistorage 持久化 | | uview-plus | 3.x | UI 组件库 (easycom) | | axios | 0.27+ | HTTP 客户端 + miniprogram-adapter | | crypto-js | 4.x | AES 加密 (纯 JS，三端通用) |

核心特性

三端条件编译

// #ifdef APP-PLUS
// Android & iOS 代码
// #endif

// #ifdef APP-HARMONY
// HarmonyOS 代码
// #endif

// #ifdef H5
// H5 代码
// #endif

多环境配置

import config from '@/config'
console.log(config.BASE_URL)  // 当前环境 API 地址

请求封装

import { post, get } from '@/utils/$http'
const { instance, cancel } = post('/api/data', { id: 1 })
const res = await instance

API 自动注册

在 src/api/modules/ 下新建文件即可自动注册：

// src/api/modules/order.js
export default {
  getList: (params) => get('/order/list', params),
  create: (data) => post('/order/create', data)
}
// 页面中: this.$api.order.getList({ page: 1 })

组件 easycom

<!-- 基础组件 -->
<scaffold-navbar title="标题" />
<scaffold-empty text="暂无数据" />
<scaffold-list :load-data="fetchData" />

<!-- v1.0.5 新增组件 -->
<scaffold-card title="卡片标题" showHeader>内容</scaffold-card>
<scaffold-tabs :list="['全部','进行中','已完成']" :current="0" @change="onChange" />
<scaffold-steps :steps="steps" :current="1" keyName="name" />
<scaffold-button type="primary" text="提交" @click="onSubmit" />
<scaffold-input v-model="keyword" placeholder="请输入" clearable />
<scaffold-form v-model="formData" :fields="fields" :rules="rules" />
<scaffold-cell label="标签" value="值" />
<scaffold-tag text="标签" type="success" />
<scaffold-section title="分区" showIndicator collapsible />
<scaffold-status-bar text="提示" type="warning" icon="warning-fill" />

登录说明

• 演示模式：点击登录页「演示模式（跳过登录）」按钮，无需后端即可进入首页查看组件演示
• 正式登录：需配置后端 API 地址（修改 src/config/env/ 下各环境配置），登录接口由 src/core/auth-service.js 调用
• 演示账号：admin / 123456（仅在已对接后端时生效，默认演示模式无需账号密码）

开始业务开发

1. 修改 src/manifest.json 中的 appid（DCloud 开发者中心申请）
2. 配置 src/config/env/ 下各环境的实际 API 地址
3. 在 src/api/modules/ 下添加业务 API 模块
4. 在 src/pages/ 下开发业务页面
5. 按需修改 src/core/crypto.js 中的加密密钥

@dcloudio 版本说明

模板中 @dcloudio 依赖版本为 3.0.0-alpha-5000420260319001，匹配 HBuilderX 5.04 alpha。 如需匹配其他版本的 HBuilderX，请修改 package.json 中所有 @dcloudio 包的版本号。

查看可用版本：

npm view @dcloudio/uni-app versions --json

License

MIT