explaingit

meituan-dianping/mpvue

★ 20,292JavaScriptAudience · developerComplexity · 3/5DormantLicenseSetup · easy

TLDR

Vue.js framework for building mini-programs (lightweight apps inside WeChat, Alipay, and other Chinese super-apps) without learning each platform's native SDK.

Mindmap

mindmap
  root((mpvue))
    What it does
      Compiles Vue to mini-programs
      Supports multiple platforms
      Familiar Vue.js patterns
    Supported Platforms
      WeChat mini-programs
      Alipay mini-programs
      Baidu smart mini-programs
      Toutiao mini-programs
    Developer Experience
      Single-file components
      Vuex state management
      Hot reload in dev
      npm dependencies
    Tech Stack
      Vue.js runtime
      Webpack build system
      Vue CLI integration

Things people build with this

USE CASE 1

Build a food delivery mini-app for WeChat that syncs with your Vue.js web codebase.

USE CASE 2

Create a shopping mini-program for Alipay using Vue components you already wrote for the web.

USE CASE 3

Deploy the same app logic across WeChat, Baidu, Toutiao, and Alipay without rewriting for each platform.

USE CASE 4

Manage state and routing in a mini-program using Vuex and Vue Router patterns you know.

Tech stack

JavaScriptVue.jsWebpackVue CLI

Getting it running

Difficulty · easy Time to first run · 30min

Requires Node.js/npm and familiarity with Vue.js; first success is a local dev build, not deployment to actual mini-program platforms.

Use freely for any purpose including commercial, as long as you keep the copyright notice.

In plain English

mpvue (short for "Vue.js in mini program") is a JavaScript framework created by Meituan-Dianping that lets developers build Chinese platform mini-programs using Vue.js, the popular web development framework. Mini-programs are lightweight apps that run inside super-apps like WeChat, Baidu's smart assistant, Toutiao (ByteDance), and Alipay, they live inside the host app rather than being installed separately on the device. Each platform has its own proprietary development environment, which normally means learning different APIs and tooling for each one. mpvue solves this by forking the Vue.js runtime and compiler and adapting them to run in these mini-program environments. Developers can write their application code using familiar Vue.js patterns, components, Vuex state management, single-file components, and the Vue CLI, and mpvue compiles that code into the format required by each target platform. This lets teams who already know Vue.js build mini-programs without learning each platform's native SDK from scratch. A webpack-based build system is included, supporting hot reload during development and npm package dependencies. The framework supports WeChat mini-programs, Baidu smart mini-programs, Toutiao mini-programs, and Alipay mini-programs. The project notes that v2.0 added support for the latter three platforms beyond the original WeChat-only v1.x. mpvue was created and is maintained by Meituan-Dianping, a major Chinese food delivery and local services company. Note that the README content and community discussions are primarily in Chinese.

Copy-paste prompts

Prompt 1
How do I set up an mpvue project and compile my Vue.js app to run as a WeChat mini-program?
Prompt 2
Show me how to use Vuex state management in an mpvue mini-program for Alipay.
Prompt 3
What are the differences between writing Vue.js for the web vs. mpvue mini-programs, and what APIs do I need to learn?
Prompt 4
How do I structure a single-codebase mpvue project that targets both WeChat and Alipay mini-programs?
Prompt 5
Can I use npm packages in mpvue, and how do I set up hot reload during development?
Open on GitHub → Explain another repo

Generated 2026-05-18 · Model: sonnet-4-6 · Verify against the repo before relying on details.