@xnng/unidev

🚀 一条命令搞定 UniApp 小程序开发，告别繁琐的手动操作

适用场景

如果你使用 HBuilderX 开发，可以通过 IDE 界面直接点击按钮运行到小程序，虽然也需要手动操作，但体验尚可。

而如果你像我一样，使用 VS Code + 命令行 开发 UniApp 项目，那你一定懂以下这些痛苦 👇

痛点

使用命令行开发微信/支付宝小程序时，每次启动开发或构建流程都很繁琐：

┌─────────────────────────────────────────────────────────────────┐
│                        传统开发流程                               │
├─────────────────────────────────────────────────────────────────┤
│                                                                 │
│  1. 终端运行 pnpm dev:mp-weixin                                  │
│              ↓                                                  │
│  2. 等待编译完成...                                               │
│              ↓                                                  │
│  3. 手动打开微信开发者工具/支付宝开发者工具                            │
│              ↓                                                  │
│  4. 点击「打开项目」                                                │
│              ↓                                                  │
│  5. 找到 dist/dev/mp-weixin 目录  ← 开发时用这个                    │
│     或者 dist/build/mp-weixin    ← 上线时用这个（容易选错！）        │
│              ↓                                                  │
│  6. 确认打开                                                     │
│                                                                 │
└─────────────────────────────────────────────────────────────────┘

这有多痛？

• 同时开发多个小程序：频繁切换项目，每次都要重复 6 个步骤
• dev 和 build 目录不同：开发用 dist/dev/，上线用 dist/build/，手动切换容易选错
• 支付宝和微信路径不同：mp-weixin vs mp-alipay，又多一层心智负担

解决方案

一条命令，全部搞定：

┌─────────────────────────────────────────────────────────────────┐
│                      使用 unidev 后                              │
├─────────────────────────────────────────────────────────────────┤
│                                                                 │
│  $ unidev pnpm dev:mp-weixin                                    │
│                     ↓                                           │
│            ✨ 自动完成一切 ✨                                      │
│                     ↓                                           │
│           开发者工具已打开，项目已加载                               │
│                                                                 │
└─────────────────────────────────────────────────────────────────┘

unidev 会：

1. 执行编译命令
2. 监听编译进度
3. 自动识别 dev/build 模式，选择正确的目录
4. 自动识别微信/支付宝平台
5. 首次编译完成后，自动打开开发者工具并加载项目

你只需要专注于写代码，其他的交给 unidev。

特性

| 特性 | 说明 | | ----------------- | -------------------------------------------- | | ✨ 一键启动 | 编译 + 自动打开开发者工具，一气呵成 | | 📂 智能目录 | 自动区分 dev 和 build 目录，再也不会选错 | | 🎯 智能识别 | 自动识别微信/支付宝平台，无需额外配置 | | 📁 多项目友好 | 支持 --cwd 指定项目目录，完美适配 monorepo | | ⚙️ 可配置 | 支持自定义开发者工具路径 | | 🔄 增量编译 | 仅首次编译时打开工具，后续热更新不会重复打开 |

快速开始

安装

# 全局安装（推荐）
npm i -g @xnng/unidev

# 或项目内安装
npm i -D @xnng/unidev

前置要求

| 平台 | 要求 | | ------------ | ---------------------------------------------------------------------------------------------- | | 微信小程序 | 安装 微信开发者工具 | | 支付宝小程序 | 安装 minidev: npm i -g minidev |

使用

# 开发模式 → 自动打开 dist/dev/mp-weixin
unidev pnpm dev:mp-weixin

# 构建模式 → 自动打开 dist/build/mp-weixin
unidev pnpm build:mp-weixin

# 支付宝开发 → 自动打开 dist/dev/mp-alipay
unidev pnpm dev:mp-alipay

# 支付宝构建 → 自动打开 dist/build/mp-alipay
unidev pnpm build:mp-alipay

Monorepo / 多项目

使用 --cwd 指定项目目录，无需 cd：

# 项目 A 开发
unidev pnpm dev:mp-weixin --cwd apps/project-a

# 项目 B 构建
unidev pnpm build:mp-alipay --cwd apps/project-b

在 package.json 中配置脚本：

{
  "scripts": {
    "dev:weixin": "unidev pnpm dev:mp-weixin --cwd apps/myApp",
    "build:weixin": "unidev pnpm build:mp-weixin --cwd apps/myApp",
    "dev:alipay": "unidev pnpm dev:mp-alipay --cwd apps/myApp",
    "build:alipay": "unidev pnpm build:mp-alipay --cwd apps/myApp"
  }
}

配置

自定义工具路径

在项目目录或用户目录下创建 .unidevrc.json：

{
  "toolPaths": {
    "wx": "/your/custom/path/to/wechat/cli"
  }
}

默认路径

| 平台 | macOS 默认路径 | | ------ | -------------------------------------------------------- | | 微信 | /Applications/wechatwebdevtools.app/Contents/MacOS/cli | | 支付宝 | 使用 minidev CLI |

命令参考

unidev <package-manager> <command> [options]

选项:
  --cwd <path>    指定项目目录
  -v, --version   显示版本号
  -h, --help      显示帮助信息

示例:
  unidev pnpm dev:mp-weixin
  unidev npm run build:mp-alipay
  unidev yarn dev:mp-weixin --cwd ./apps/myApp

工作原理

命令解析 → 执行编译 → 监听输出 → 检测完成 → 打开工具
   │          │          │          │          │
   │          │          │          │          └─ 调用开发者工具 CLI
   │          │          │          │
   │          │          │          └─ 检测 "Build complete"
   │          │          │
   │          │          └─ 过滤增量编译（不重复打开）
   │          │
   │          └─ pnpm dev:mp-weixin
   │
   └─ 识别平台(weixin/alipay) + 模式(dev/build)

系统要求

• macOS / Windows
• Node.js >= 14

License

MIT © xnng

如果这个工具对你有帮助，欢迎 ⭐️ Star 支持！