Skip to main content

Prerequisites

Before installing MorJS, ensure your environment meets these requirements:
RequirementVersion
Node.js>= 12.13.0
npm / pnpm / yarnany recent version
MorJS uses pnpm internally for its own monorepo. Your project can use npm, pnpm, or yarn.

Step 1: Install the CLI

Install @morjs/cli globally so the mor command is available everywhere:
npm install -g @morjs/cli
Verify the installation:
mor --version

Step 2: Create a new project

Use the mor create command to scaffold a new project:
mor create my-miniprogram
The generator will prompt you for:
  • Project name
  • Source DSL (wechat or alipay)
  • Target platforms
  • Whether to include TypeScript
You can also integrate MorJS into an existing mini-program by installing @morjs/cli and @morjs/core as dependencies and adding a mor.config.ts.

Step 3: Explore the project structure

A scaffolded MorJS project looks like this:
my-miniprogram/
├── mor.config.ts          # MorJS configuration
├── package.json
├── tsconfig.json
└── src/
    ├── app.ts             # App entry
    ├── app.json           # App manifest (pages list)
    ├── app.less           # Global styles
    └── pages/
        └── index/
            ├── index.ts   # Page logic
            ├── index.xml  # Page template
            ├── index.less # Page styles
            └── index.json # Page config
Template files use .xml by default for DSL-agnostic source. MorJS maps .xml to the correct extension (.wxml, .axml, .ttml, etc.) for each target platform.

Step 4: Configure mor.config.ts

Open mor.config.ts in your project root. A minimal configuration looks like this:
mor.config.ts
import { defineConfig } from '@morjs/cli'

export default defineConfig({
  name: 'wechat',          // Unique name for this config entry
  sourceType: 'wechat',    // DSL the source is written in: 'wechat' | 'alipay'
  target: 'wechat',        // Compile target platform
  compileMode: 'bundle',   // 'bundle' | 'transform'
  srcPath: 'src',          // Source directory (default: 'src')
  outputPath: 'dist',      // Output directory (default: 'dist')
})
To compile to multiple platforms at once, export an array of configs:
mor.config.ts
import { defineConfig } from '@morjs/cli'

export default defineConfig([
  {
    name: 'wechat',
    sourceType: 'wechat',
    target: 'wechat',
    outputPath: 'dist/wechat',
  },
  {
    name: 'alipay',
    sourceType: 'wechat',
    target: 'alipay',
    outputPath: 'dist/alipay',
  },
  {
    name: 'web',
    sourceType: 'wechat',
    target: 'web',
    outputPath: 'dist/web',
  },
])

Step 5: Compile your project

Run a one-time compile for a specific target:
mor compile --target wechat
Or omit --target to use the target(s) defined in mor.config.ts:
mor compile

Watch mode

Pass --watch to recompile whenever source files change:
mor compile --target wechat --watch

Compile a specific named config

When your config exports an array, use --name to select one entry:
mor compile --name alipay

Available compile targets

mor compile --target wechat      # WeChat mini-program
mor compile --target alipay      # Alipay mini-program
mor compile --target baidu       # Baidu mini-program
mor compile --target bytedance   # ByteDance mini-program
mor compile --target qq          # QQ mini-program
mor compile --target kuaishou    # Kuaishou mini-program
mor compile --target taobao      # Taobao mini-program
mor compile --target dingding    # DingTalk mini-program
mor compile --target web         # H5 Web

Step 6: Open in the platform DevTools

After compiling, open the output directory in the corresponding platform’s developer tool:
TargetDevTool
wechatWeChat DevTools — open dist/wechat
alipayAlipay Mini Program Studio — open dist/alipay
webA local web server — dist/web contains standard HTML/JS/CSS
Each platform DevTool requires the output directory to contain a valid app.json. MorJS generates this automatically during compilation.

Verbose logging

For debugging, pass --verbose to print internal framework logs:
mor compile --target wechat --verbose

Configuration reference

Full reference for all mor.config.ts options.

Compile options

All flags and options for mor compile.

Architecture

Understand Takin, Runner, and the plugin lifecycle.

Plugin development

Extend MorJS with your own plugin.

Build docs developers (and LLMs) love