Mpx
框架活跃维护滴滴开源的增强型小程序开发框架。以微信小程序为基底，深度定制 Vue 语法，提供完整的类型支持、状态管理、跨平台能力。性能优异，包体增量极小。
★ 3,910🕒 最近更新 2026-06
前端框架小程序UI框架Mpx滴滴Vue数据响应
特性
- Vue语法增强
- 类型推导
- 状态管理（响应式）
- 分包优化
- 跨平台编译
- Web Components输出
- 极小运行时开销
详细文档
Mpx — 滴滴增强型小程序框架
功能特性
Mpx 是滴滴开源的小程序增强框架，以微信小程序为基底深度定制 Vue 语法：
- 数据响应：基于 Vue 的响应式系统，自动追踪依赖，精准更新 setData
- 跨端编译：一次开发，编译到微信/支付宝/百度/抖音/QQ/头条等多端
- 组件化：支持单文件组件（.mpx），模板/样式/逻辑/配置四段式
- 状态管理：内置 Vuex/Pinia 支持
- TypeScript：原生类型支持
- 性能优化：按需依赖追踪，最小化 setData 数据量
核心组件与 API
页面/组件开发
<!-- page.mpx -->
<template>
<view class="container">
<text>{{message}}</text>
<button bindtap="handleTap">点击</button>
</view>
</template>
<script>
import { createPage } from "@mpxjs/core"
createPage({
data: { message: "Hello Mpx" },
methods: {
handleTap() { this.message = "已点击" }
}
})
</script>
<style lang="stylus">
.container { padding: 20rpx; }
</style>
<script type="json">
{ "usingComponents": {} }
</script>
跨端条件编译
if (process.env.MPX_ENV === "wx") {
wx.someWeChatOnlyApi()
}
UI 库集成
| UI 库 | 支持度 | 说明 |
|---|---|---|
| mpx-cube-ui | 原生 | Mpx 官方组件库，跨端 |
| Vant Weapp | 需适配 | 微信端可用 |
| NutUI | 需适配 | 适配中 |
Agent 开发参考
- 安装：
npm install @mpxjs/cli && npx mpx create - 编译微信：
npm run build:wx - 文档：https://mpxjs.cn/