Mpx框架

Mpx 是一款增强型跨端小程序框架，通过深度整合数据响应、setData 优化和包体积分析，将一份源码输出到所有小程序平台及 Web，同时完整兼容原生小程序技术规范。

核心能力

• 数据响应: 提供类似 Vue 的数据赋值响应、watch 和 computed，运行时核心仅 51KB
• 模板增强: 支持 wx:style 动态样式、wx:model 双向绑定、wx:ref 获取实例、component 动态组件
• 状态管理: 内置 Vuex 风格 store，支持多实例跨团队模式；2.8 版本起引入 Pinia
• 极致性能: 基于依赖收集的 setData 优化，编译构建自动抽离分包共用模块，包体积分析工具 @mpxjs/size-report

跨平台与渐进迁移

• 跨端输出: 通过静态转译+运行时适配，一份源码输出微信/支付宝/百度/头条/QQ/Web/React Native，target 参数支持 wx/ali/swan/qq/tt/web/qa/android/ios/harmony
• 原生兼容: 完整支持小程序原生组件、npm 第三方包、custom-tab-bar、workers、云开发
• 渐进迁移: 老项目可逐步接入，新模块用 Mpx 编写后通过导出原生功能反向应用到现有原生项目，无需全局重写
• 原生组件引用: 在 usingComponents 中指定路径后，Mpx 自动编译并精确收集依赖，仅打包使用到的组件

开发体验与生态

• 单文件开发: .mpx 文件内包含 template/style/js/json，类似 Vue SFC
• 脚手架: @mpxjs/cli 提供 create 命令创建项目，支持微信插件项目（需填写 AppID）
• IDE 支持: 推荐 VS Code + Mpx (Official) 扩展
• 官方库: 包含 @mpxjs/core 运行时、@mpxjs/webpack-plugin 编译、@mpxjs/fetch 网络请求（抹平台差异，支持拦截器与请求取消）、@mpxjs/api-proxy、@mpxjs/webview-bridge
• 成功案例: 滴滴出行、青桔单车、花小猪打车、唯品会、学而思等

常见问题

Q1：Mpx 与原生小程序开发的主要区别是什么？

A1：Mpx 以增强方式补全原生标准，提供数据响应、组合式 API、模板增强（如 wx:model 双向绑定）等 Vue 特性，同时完整兼容原生组件与 npm 生态。运行时核心仅 51KB，通过依赖收集实现 setData 优化，性能优于原生开发。

Q2：Mpx 如何实现跨平台输出？

A2：通过静态转译与运行时适配结合，一份源码可输出到微信、支付宝、百度、头条、QQ、Web 及 React Native。编译时使用 --targets 参数指定平台（如 wx,ali），支持条件编译（文件级/代码块级/行级）处理平台差异。

Q3：已有原生小程序项目如何迁移到 Mpx？

A3：Mpx 支持渐进迁移：新页面/组件用 Mpx 编写后通过导出原生功能反向应用到现有项目；老模块可逐步重写为 .mpx 文件，无需全局改动。Mpx 官方提供渐进接入 demo 参考。

更多同类工具与网站,可在移动端分类继续挑选。

信息核实于 2026年7月,具体以官网为准。