Skip to Content

Quick Start

从一个 Taro React 小程序项目开始接入 VekUI。

v0 的目标是先让开发者稳定拿到组件源码,并能在微信小程序构建链路里验证。 下面流程只覆盖最小可用路径。

Before you start

先确认项目满足这些条件。

  • Taro React 微信小程序项目
  • pnpm workspace 或普通 pnpm 项目
  • 项目样式入口可 import CSS
  • 小程序构建走 Taro Vite compiler

Install flow

四步完成源码接入。

  1. 01

    初始化 VekUI 约定

    生成 vekui.json、cn 工具函数、token CSS 和默认目录别名。

    pnpm dlx vekui init --cwd . --yes
  2. 02

    添加需要的组件

    从 registry 读取组件条目,把源码复制到配置中的 components 目录。

    pnpm dlx vekui add button input --cwd .
  3. 03

    接入样式入口

    在应用全局样式里导入 VekUI token,让组件 class 能映射到小程序安全样式。

    @import "./styles/vekui.css";
  4. 04

    运行 doctor

    检查 Taro 依赖、CSS 入口、危险 DOM/Radix 引用和基础项目约定。

    pnpm dlx vekui doctor --cwd .

Generated output

执行后应该能看到这些文件。

如果路径不同,优先检查 vekui.json 里的 aliases 配置。CLI 会按你的配置解析目标目录。

vekui.jsonsrc/lib/cn.tssrc/styles/vekui.csssrc/components/ui/button.tsxsrc/components/ui/input.tsx

Verify

最后用真实小程序构建兜底。

pnpm dlx vekui doctor --cwd .
pnpm build:miniprogram

doctor 只负责项目规则检查;小程序运行时问题仍然要用 Taro 构建和微信开发者工具验证。