Mor (发音为 /mr/，类似 more)，是饿了么开发的一款基于小程序 DSL 的，可扩展的多端研发框架，使用小程序原生 DSL 构建，使用者只需书写一套（微信或支付宝）小程序，就可以通过 Mor 的转端编译能力，将源码分别编译出可以在不同端（微信/支付宝/百度/字节/钉钉/快手/QQ/淘宝/Web…）运行的产物。

MorJS 以多端编译为基础，配以面向全生命周期的插件体系，覆盖从源码到构建产物的每个阶段，支持各类功能扩展和业务需求，无论是基础的页面和组件还是复杂的分包和插件，MorJS 都可以胜任，帮助你高效地开发多端小程序。

核心能力

Mor 是一套基于小程序 DSL (支付宝或微信) 的框架。他的易用性、标准化和灵活性，使得开发者能更好地专注于业务，让开发成本，招聘、管理、测试各方面成本都大幅下降，提高开发者的工作效率。

• 易用性： DSL 支持：可使用微信小程序 DSL 或 支付宝小程序 DSL 编写小程序，无额外使用成本； 多端支持：支持将一套小程序转换为各类小程序平台及 Web 应用, 节省双倍人力； 快速接入：仅需引入两个包，增加一个配置文件，即可简单快速接入到现有小程序项目；
• 标准化： 开箱即用：内置了脚手架、构建、分析、多端编译等完整研发能力，仅需一个依赖即可上手开发； 表现一致：通过编译时+运行时抹平多端差异性，让不同平台的小程序获得一致的用户体验； 形态转换：支持同一个项目的不同的形态，允许小程序、分包、插件不同形态之间的相互转换；
• 灵活性： 方便扩展：Mor 将完备的生命周期和内部功能插件化，使用插件(集)以满足功能和垂直域的分层需求； 类型支持：除小程序标准文件类型外，还支持 ts、less/scss、jsonc/json5 等多种文件类型； 按需适配：可根据需求选择性接入适配能力，小项目仅需编译功能，中等项目可结合编译和页面注入能力，大型项目推荐使用复杂小程序集成能力；

示例

以下是饿了么-美食外卖频道在微信、支付宝、抖音小程序及 H5 中的表现。

快速开始

环境准备

MorJS 项目基于 node，请确保已具备较新的 node 环境（>=14），推荐使用 node 版本管理工具 nvm 来管理 node（Windows 下使用 nvm-windows），这样可以很方便地切换 node 版本，全局安装时候也不必再使用 sudo。

# mac 或 linux 下安装 nvm
$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
$ nvm -v
0.39.1

# 安装 node
$ nvm install 14
$ nvm use 14
$ node -v
v14.21.3

创建项目

Mor 提供了 create-mor 和 mor cli 工具两种方式来创建新项目，选择其中任一一种即可。

使用 create-mor 创建项目

确保你安装了符合版本的 Node.js，选定项目目录

$ mkdir myapp && cd myapp # 创建项目目录

在目录终端执行以下任一命令：

$ npm init mor # npm 创建项目
$ yarn create mor # yarn 创建项目
$ pnpm create mor # pnpm 创建项目

这一指令将会安装并执行 create-mor，它是 Mor 官方的项目脚手架工具。

使用 mor cli 创建项目

确保你安装了符合版本的 Node.js，创建项目目录，全局安装 mor cli 工具

$ mkdir myapp && cd myapp # 创建项目目录
$ npm i @morjs/cli -g # 全局安装 mor cli
$ mor -v # 查看全局 mor 版本

此时你已安装了 mor cli 工具，然后通过 mor init 命令即可创建项目：

$ mor init

初始化项目

创建项目后你会看到如下命令号交互界面，选择对应的工程类型，按照提示完成初始化操作：

 请选择工程类型 > 小程序
 请选择源码类型 > 微信小程序 DSL
 是否使用 Typescript … 否 / 是
 请选择 CSS 预处理器 > less
 请输入 小程序 的名称 … myapp
 请输入 小程序 的描述 … my first app
 用户名 … yourUserName
 邮箱 … your@gmail.com
 请输入 Git 仓库地址 … https://github.com/yourUserName/myapp
 请选择 npm 客户端 > npm / pnpm / yarn
…
[mor]  安装 node_modules 完成!
[mor]  小程序项目初始化完成 ^_^ 在终端运行命令 

        npm run dev

        即可启动项目。

在项目初始化之后，Mor 会默认开始安装项目所需要的依赖，一般来说，依赖安装会自动完成，但某些情况下可能会安装失败，这时候你可以在项目目录下自己使用安装命令进行安装：

$ npm i

编译运行

使用 MorJS 的 compile 命令可以把 MorJS 代码编译成不同端的代码，然后在对应的开发工具中查看效果。MorJS 初始的编译命令配置了 dev 和 build 两种模式：

• dev 模式（增加 --watch 参数）将会监听文件修改。
• build 模式（增加 --production 参数）将对代码进行压缩打包。

执行 npm run dev 命令，进行浏览调试：

[mor] i 发现配置文件: mor.config.ts
[mor]  配置文件加载成功: mor.config.ts
[mor] i 准备配置中, 即将开始编译 
        配置名称: wechat-miniprogram
        编译目标: 微信小程序
        编译环境: development
        编译类型: 小程序
        编译模式: bundle
        源码类型: wechat
        源码目录: src
        输出目录: dist/wechat
[mor] i 已开启缓存, 可通过 --no-cache 关闭
[mor] i 启动文件监听模式
[mor] i 开始编译 ...
[mor] i 依赖分析中 ...
[mor] i 依赖分析完成: 耗时: 25.125412 ms
[mor]  编译完成, 耗时: 1451.202285 ms

[mor] i 准备配置中, 即将开始编译 
        配置名称: alipay-miniprogram
        编译目标: 支付宝小程序
        编译环境: development
        编译类型: 小程序
        编译模式: bundle
        源码类型: wechat
        源码目录: src
        输出目录: dist/alipay
[mor] i 已开启缓存, 可通过 --no-cache 关闭
[mor] i 启动文件监听模式
[mor] i 开始编译 ...
[mor] i 依赖分析中 ...
[mor] i 依赖分析完成: 耗时: 24.112123 ms
[mor]  编译完成, 耗时: 441.548922 ms

多端产物已构建在 dist 目录下，分别用对应平台的 IDE 打开即可开发预览：

• 在 微信开发者工具 中打开 dist/wechat 目录即可开始微信小程序开发预览
• 在 支付宝小程序开发者工具 中打开 dist/alipay 目录即可开始微信小程序开发预览

什么时候不用 MorJS

如你所见，MorJS 是一套基于小程序 DSL (支付宝、微信) 的框架，如果你，

• 期望使用 React 或 Vue 的方式来编写小程序
• 期望使用 Web 的方式开发
• 有很强的 webpack 自定义需求和主观意愿
• 需要以 微信小程序或支付宝小程序 DSL 以外的方式开发
• 需要跑在 Node 14 以下的环境中

MorJS 可能不适合你。

传送门

开源协议：MIT

开源地址：https://github.com/eleme/morjs

项目合集：https://github.com/RepositorySheet