CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-dcloudio--uni-mp-alipay

Alipay Mini Program adapter for uni-app cross-platform framework

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

index.mddocs/

@dcloudio/uni-mp-alipay

@dcloudio/uni-mp-alipay is a specialized adapter package that enables uni-app applications to run on Alipay Mini Program platform. It provides complete compiler integration, runtime adaptation, and API compatibility layer to bridge the gap between Vue.js-based uni-app code and Alipay's mini program environment.

Package Information

  • Package Name: @dcloudio/uni-mp-alipay
  • Package Type: npm
  • Language: TypeScript
  • Installation: Installed as part of uni-app development tools via @dcloudio/cli
  • Platform: Alipay Mini Program (mp-alipay)
  • Framework: Vue.js 3.x

Core Imports

The package exports are typically consumed through the uni-app build system rather than direct imports:

// Build system usage (Vite plugins)
import uniMpAlipayPlugin from "@dcloudio/uni-mp-alipay";

// Runtime (auto-injected in mini program environment)
import { createApp, createPage, createComponent } from "@dcloudio/uni-mp-alipay/dist/uni.mp.esm.js";

// API access (auto-injected)
import uni from "@dcloudio/uni-mp-alipay/dist/uni.api.esm.js";

Basic Usage

The package is integrated into uni-app projects through the build configuration:

// vite.config.ts
import { defineConfig } from 'vite';
import uniMpAlipayPlugin from '@dcloudio/uni-mp-alipay';

export default defineConfig({
  plugins: [
    ...uniMpAlipayPlugin // Array of Vite plugins for Alipay compilation
  ]
});

In the mini program runtime environment, the APIs are automatically available:

// Page definition
const pageOptions = {
  onLoad() {
    // createApp, createPage are automatically available via my.createApp, my.createPage
    this.$vm = my.createPage(vueComponentOptions);
  }
};

// Using adapted APIs
uni.request({
  url: 'https://api.example.com/data',
  success: (res) => console.log(res.data)
});

Architecture

The package is structured around three main functional areas:

  • Compiler Integration: Vite plugins and Vue compiler transforms that adapt uni-app code for Alipay Mini Program build requirements
  • Runtime Layer: App, page, and component creation functions that bridge Vue.js components with Alipay's mini program lifecycle
  • API Adaptation: Complete uni API implementation with Alipay-specific protocol adaptations and compatibility shims

Capabilities

Compiler Integration

Vite plugins and Vue compiler configuration for building uni-app applications targeting Alipay Mini Program platform.

declare const uniMpAlipayPlugin: Plugin[];

interface MiniProgramCompilerOptions {
  event: EventOptions;
  class: ClassOptions;
  slot: SlotOptions;
  directive: string;
  component: ComponentOptions;
  filter: FilterOptions;
}

interface CompilerOptions {
  nodeTransforms: NodeTransform[];
}

Compiler Integration

Runtime Layer

Core runtime functions for creating and managing uni-app applications, pages, and components in the Alipay Mini Program environment.

function createApp(parseAppOptions: any): any;
function createPage(): any;
function createComponent(): any;
function createPluginApp(parseAppOptions: any): any;
function createSubpackageApp(parseAppOptions: any): any;

Runtime Layer

API Adaptation

Complete uni API implementation with Alipay-specific adaptations, protocol mappings, and compatibility shims for seamless cross-platform development.

declare const uni: UniAPI;

interface UniAPI {
  // Storage APIs
  setStorageSync(key: string, data: any): void;
  getStorageSync(key: string): any;
  removeStorageSync(key: string): void;
  
  // Network APIs
  request(options: RequestOptions): void;
  
  // UI APIs
  showModal(options?: ShowModalOptions): void;
  showToast(options?: ShowToastOptions): void;
  showActionSheet(options: ShowActionSheetOptions): void;
  
  // Device APIs
  getSystemInfo(options: GetSystemInfoOptions): void;
  getSystemInfoSync(): SystemInfo;
  
  // And 50+ more APIs...
}

API Adaptation

Platform Compatibility

This package specifically targets Alipay Mini Program platform with the following characteristics:

  • Global Object: my (Alipay's global API object)
  • Template Engine: .axml files (Alipay's template format)
  • Styling: .acss files (Alipay's CSS variant)
  • Scripting: .sjs files (Alipay's JavaScript variant)
  • Build Target: CommonJS modules for Alipay Mini Program runtime

Types

interface UniMiniProgramPluginOptions {
  cdn: number;
  vite: ViteOptions;
  global: string;
  json: JsonOptions;
  app: AppOptions;
  project: ProjectOptions;
  template: TemplateOptions;
  style: StyleOptions;
}

interface ViteOptions {
  inject: Record<string, [string, string]>;
  alias: Record<string, string>;
  copyOptions: CopyOptions;
}

interface JsonOptions {
  windowOptionsMap: Record<string, string>;
  tabBarOptionsMap: Record<string, string>;
  tabBarItemOptionsMap: Record<string, string>;
}

Install with Tessl CLI

npx tessl i tessl/npm-dcloudio--uni-mp-alipay

docs

api.md

compiler.md

index.md

runtime.md

tile.json