Antmove小程序跨平臺開發(fā)統(tǒng)一解決方案
Antmove（中文：螞蟻搬家），是一個小程序平臺開發(fā)的統(tǒng)一解決方案，通過編寫一次代碼，編譯成不同平臺的小程序代碼，如現(xiàn)如今使用比較多的微信小程序、支付寶小程序、百度智能小程序、頭條小程序以及更多小程序平臺。現(xiàn)Antmove已支持微信小程序和支付寶小程序的轉(zhuǎn)換，其中百度智能小程序、頭條小程序以及更多的支持也即將推出。
antmove 的初衷是提供一種小程序跨平臺開發(fā)的解決方案，幫助開發(fā)者底層本實現(xiàn)小程序的跨平臺開發(fā)（微信小程序、支付寶小程序、百度智能小程序、頭條小程序），做到一套代碼開發(fā)、多小程序平臺運行的目的。
目前 antmove 已經(jīng)幫助了多款微信小程序到支付寶小程序的遷徙，代碼轉(zhuǎn)換率高達 90%+，極大的降低了小程序開發(fā)企業(yè)的人力成本。工具不僅能做到運行時 diff 的抹平，也能部分做到一個 API 從無到有的過程以及缺失組件的支持。
1、特性
- 簡單易使用，無學(xué)習(xí)成本，直接上手
- 轉(zhuǎn)換覆蓋率全面，及時跟進各小程序平臺更新情況
- 配套詳細的編譯時日志/運行時日志工具
- 編譯生成代碼可讀性強，可二次編程
- 二次編譯支持
2、安裝
vscode 轉(zhuǎn)換插件，可以在VSCode的擴展中搜索Antmove下載安裝轉(zhuǎn)換插件來實現(xiàn)一鍵轉(zhuǎn)換。
3、編譯步驟
- 安裝擴展（Antmove - antmove-vscode-plugin）
- 在 VsCode 中打開要轉(zhuǎn)換的項目
- 打開 VsCode 命令面板
- Mac: command + shift + p
- Windows: ctrl + shift + p
- 輸入 Antmove
- 運行 Antmove: Run antmove 命令
- 運行如上命令后會給出一個彈窗，選擇轉(zhuǎn)換后生成代碼存儲目錄
- 轉(zhuǎn)換完成
4、使用 npm 或 yarn 安裝
推薦使用 npm 或 yarn 的方式進行開發(fā)，不僅可在開發(fā)環(huán)境輕松調(diào)試，也可放心地在生產(chǎn)環(huán)境打包部署使用
- 全局安裝
$ npm install antmove -g
- 本地安裝
$ npm install antmove --save
由于網(wǎng)絡(luò)環(huán)境原因可以使用cnpm來進行安裝
5、命令行使用
通過 npm 或 yarn 全局安裝才能使用如下命令行
提供兩種可用的命令行調(diào)用方式：
- antmove wx-alipay（使用前請將終端切換到需轉(zhuǎn)換編譯的微信小程序項目路徑）
antmove wx-alipay ./dist/alipay-app
- antmove - 該命令更加靈活，可配置輸出輸出目錄/編譯模式等
antmove -i ./wechat-mini/project -o ./dist/alipay-mini/project --env development
如上的命令表示將 ./wechat-mini/project 微信小程序項目轉(zhuǎn)換為支付寶小程序項目，轉(zhuǎn)換到 ./dist/alipay-mini/project 目錄
參數(shù)說明
- --input,-i
- 可選，編譯源碼目錄，如果不傳則是當(dāng)前目錄
- --output,-o
- 必傳，編譯輸出目錄
- --env,-e
- 可選（development/production），編譯模式，生產(chǎn)模式代碼會壓縮，無編譯日志及運行時日志
6、Node.js 使用方式
簡單示例
const path = require('path');
const transformFramework = require('antmove');
const WechatPlugin = require('@antmove/wx-alipay');
let outputPath = path.join(__dirname, '../../dist');
let inputDirPath = path.join(__dirname, '../../examples/miniprogram-demo/miniprogram');
const App = transformFramework();
App.use(
WechatPlugin,
{
entry: inputDirPath,
dist: outputPath + '/alipaymini-demo',
env: 'development'
})
.start();
7、API
transformFramework
工具實例生成函數(shù)。
const transformFramework = require('antmove');
const App = transformFramework(); // 得到的 app 實例即可進行轉(zhuǎn)換處理操作
App
- use | Function - App.use(plugin, pluginOptions) - 掛載插件到實例上，可掛載多個，按掛載順序執(zhí)行
- plugin: 轉(zhuǎn)換插件
- pluginOptions: 轉(zhuǎn)換插件配置項
- entry | String - 轉(zhuǎn)換源碼目錄
- dist | String - 轉(zhuǎn)換后代碼輸出目錄
- env | String - 編譯環(huán)境設(shè)置（env/prod）
- 默認值為生產(chǎn)環(huán)境
- remote | Boolean - 是否拉去遠程拉取 polyfill 代碼
- 默認開啟
- start | Function - 開始編譯操作
8、高級用法
- 支付寶代碼與微信代碼混合編寫
- 微信小程序到支付寶小程序登錄遷徙