@dcloudio/uni-mp-weixin is the WeChat Mini Program platform adapter for uni-app, enabling developers to build cross-platform Vue.js applications that run seamlessly on WeChat's Mini Program platform. It provides runtime libraries, compiler configuration, API adapters, and development tooling specifically optimized for WeChat Mini Program deployment.
npm install @dcloudio/uni-mp-weixin// Default export (uni runtime object) + named exports
import uni, { createApp, createPage, createComponent, createPlugin, createSubpackageApp } from "@dcloudio/uni-mp-weixin";
// Or import individual components
import { createApp } from "@dcloudio/uni-mp-weixin";
import { Page, Component, Behavior, nextTick } from "@dcloudio/uni-mp-weixin/dist/mp";For CommonJS:
// Import default uni object and named exports
const uni = require("@dcloudio/uni-mp-weixin").default;
const { createApp, createPage, createComponent, createPlugin, createSubpackageApp } = require("@dcloudio/uni-mp-weixin");
// Import MP runtime components
const { Page, Component, Behavior, nextTick } = require("@dcloudio/uni-mp-weixin/dist/mp");import { createApp, createPage } from "@dcloudio/uni-mp-weixin";
// Create uni-app application for WeChat Mini Program
const app = createApp({
onLaunch() {
console.log('App launched');
},
globalData: {
userInfo: null
}
});
// Create a page component
const indexPage = createPage({
data() {
return {
title: 'Hello World'
};
},
onLoad() {
console.log('Page loaded');
},
methods: {
handleTap() {
uni.showToast({
title: 'Tapped!',
icon: 'success'
});
}
}
});@dcloudio/uni-mp-weixin is built around several key components:
uni object that wraps WeChat Mini Program APIs with cross-platform compatibilityCore framework functions for creating WeChat Mini Program applications, pages, and components from Vue.js component options.
function createApp(options: AppOptions): VueInstance;
function createPage(options: PageOptions): WeXinPageComponent;
function createComponent(options: ComponentOptions): WeixinComponent;
function createSubpackageApp(vm: VueInstance): VueInstance;
function createPlugin(vm: VueInstance): VueInstance;Vue.js-compatible event system that integrates with WeChat Mini Program's event handling model.
function $on(event: string, callback: Function): any;
function $off(event?: string, callback?: Function): any;
function $once(event: string, callback: Function): any;
function $emit(event: string, ...args: any[]): any;Middleware system for intercepting and modifying API calls, supporting both global and method-specific interceptors.
function addInterceptor(method: string | object, option?: object): void;
function removeInterceptor(method: string | object, option?: object): void;
interface InterceptorOption {
invoke?: Function[];
success?: Function[];
fail?: Function[];
complete?: Function[];
returnValue?: Function[];
}Helper functions for unit conversion and WeChat Mini Program specific operations.
function upx2px(upx: number | string, newDeviceWidth?: number): number;
function getProvider(options: ProviderOptions): void;
interface ProviderOptions {
service: 'oauth' | 'share' | 'payment' | 'push';
success?: (result: ProviderResult) => void;
fail?: (error: any) => void;
complete?: (result: any) => void;
}Build-time configuration and template compilation utilities for WeChat Mini Program development.
// Configuration options for WeChat Mini Program platform
interface WeXinConfig {
options: {
cssVars: Record<string, string>;
extnames: {
style: string;
template: string;
filter: string;
};
filterTag: string;
project: string;
subPackages: boolean;
darkmode: boolean;
};
copyWebpackOptions(platformOptions: any, vueOptions: any): any[];
}Low-level WeChat Mini Program runtime components for direct integration with Mini Program lifecycle and behaviors.
function Page(options: PageOptions): void;
function Component(options: ComponentOptions): void;
function Behavior(options: BehaviorOptions): BehaviorOptions;
const nextTick: typeof Vue.nextTick;WeChat Mini Program WXS (WeiXin Script) utility functions for use in WeChat Mini Program expressions and filters.
function getRegExp(...args: any[]): RegExp;
function getDate(...args: any[]): Date;// Core application options
interface AppOptions {
onLaunch?: (options: any) => void;
onShow?: (options: any) => void;
onHide?: () => void;
onError?: (error: string) => void;
onPageNotFound?: (options: any) => void;
onThemeChange?: (theme: any) => void;
onUnhandledRejection?: (options: any) => void;
globalData?: Record<string, any>;
[key: string]: any;
}
// Page component options
interface PageOptions {
data?: () => Record<string, any>;
onLoad?: (query: Record<string, string>) => void;
onShow?: () => void;
onReady?: () => void;
onHide?: () => void;
onUnload?: () => void;
onPullDownRefresh?: () => void;
onReachBottom?: () => void;
onShareAppMessage?: (options: any) => any;
onPageScroll?: (options: any) => void;
onResize?: (options: any) => void;
onTabItemTap?: (item: any) => void;
methods?: Record<string, Function>;
[key: string]: any;
}
// Component options
interface ComponentOptions {
data?: () => Record<string, any>;
props?: Record<string, any>;
methods?: Record<string, Function>;
created?: () => void;
attached?: () => void;
ready?: () => void;
moved?: () => void;
detached?: () => void;
[key: string]: any;
}
// Behavior configuration options for MP runtime
interface BehaviorOptions {
properties?: Record<string, any>;
data?: Record<string, any>;
methods?: Record<string, Function>;
lifetimes?: {
created?: () => void;
attached?: () => void;
ready?: () => void;
moved?: () => void;
detached?: () => void;
};
definitionFilter?: (defFields: any) => void;
}
// Provider service result
interface ProviderResult {
errMsg: string;
service: string;
provider: string[];
}