<button
class="bg-emerald-700 text-white
rounded-md px-6 py-3
font-medium">
开始构建
</button>import { defineConfig } from 'weapp-vite'
export default defineConfig({
weapp: {
multiPlatform: {
enabled: true,
targets: ['weapp'],
},
},
})dist/weapp/dist/index.wxmlindex.wxssindex.jsindex.jsonpnpm exec wv build -p weapppnpm dlx @varo-ui/cli add \
--target weapp \
button input card工具分别接管样式转换、工程构建与组件源码，让现有小程序可以渐进接入，也让 H5 与新项目共享现代开发体验。
继续使用原生小程序、Vue SFC 或跨端框架，保留团队熟悉的页面与组件边界。
让 weapp-tailwindcss 处理样式与类名，让 weapp-vite 处理依赖、路由和多平台构建生命周期。
从 Varo Registry 安装可编辑的双端组件、业务 Blocks 与 Agent UI，并在真实运行时中验证交付。
工具栈
按需独立采用，也可以组合成从样式、构建到 H5 与小程序组件源码的完整工程。
<button
class="bg-emerald-700 text-white
rounded-md px-6 py-3
font-medium">
开始构建
</button>01 / 样式
稳定版把 Tailwind CSS 的原子化体验带到全端
在小程序和跨端框架中使用熟悉的 Tailwind CSS 工作流，覆盖样式生成、转义、运行时变量与多平台差异。
import { defineConfig } from 'weapp-vite'
export default defineConfig({
weapp: {
multiPlatform: {
enabled: true,
targets: ['weapp'],
},
},
})dist/weapp/dist/index.wxmlindex.wxssindex.jsindex.jsonpnpm exec wv build -p weapp02 / 构建
稳定版面向小程序的现代 Vite 工程化工具链
用 Vite 驱动小程序开发、构建和多平台输出，并提供 Vue SFC、Wevu 运行时、自动路由与工程扩展能力。
pnpm dlx @varo-ui/cli add \
--target weapp \
button input card我们希望把样式、构建与组件能力连接成一套开放、可组合、可验证的工程生态。
每个工具都能独立使用，也能通过清晰边界组合起来。
保留原生小程序、Vue SFC 与跨端框架的写法，降低迁移成本。
让构建输出、运行时表现和发布记录都可以被检查与复现。