微信小程序出(chū)現後，衆多公司平台也(yě)紛紛推出(chū)了(le／liǎo)自家的(de)小程序（快應用），比如百度智能小程序、支付寶小程序、字節跳動小程序以(yǐ)及國(guó)内手機廠商的(de)快應用等等。每家小程序（快應用）平台都有各自的(de)流量入口，開發者多上(shàng)傳一個(gè)平台，就(jiù)多一份流量來(lái)源。

各平台小程序語法非常相近，業界已經有許多小程序跨端解決方案。一種方式是(shì)從已有的(de)微信小程序出(chū)發，利用轉換工具（比如 qa-adapter, wx2swan, wx2my, antmove）轉換成目标小程序的(de)代碼。另一種方式是(shì)利用小程序多端框架（比如 taro, uni-app, mpvue）開發。

下面介紹第一種方式，如何基于(yú)已有的(de)微信小程序，利用轉換工具生成多端代碼。并以(yǐ) IQOO 社區小程序爲(wéi / wèi)例，體驗下各平台的(de)轉換流程。

微信 => 百度

百度小程序官方文檔上(shàng)提供了(le／liǎo) 轉換工具

支持兩種轉換形式： npm 命令行 和(hé / huò) 開發工具

npm 轉換

npm install -g wx2swan
wx2swan wxmp

輸出(chū)目錄會自動添加 _swan 後綴

同時(shí)，轉換的(de)代碼中會生成 log 文件。包含三種 log：

log
├── error.json   （沒法轉換過來(lái)的(de)，目前不(bù)支持的(de)，比如百度暫未支持的(de)API，二次開發時(shí)需要(yào / yāo)修改的(de)）
├── info.json    （搬家工具轉換操作的(de)log）
└── warning.json （根據經驗，有可能引起報錯的(de)，二次開發時(shí)候需要(yào / yāo)重點注意的(de)）

error.json 例子(zǐ)：

[{
  "type": "delete api",
  "file": "/Users/dev/packageAPI/pages/bluetooth/bluetooth.js",
  "row": 50,
  "column": 10,
  "before": "wx.onBluetoothAdapterStateChange(function (res) {\n  if (res && res.available) {\n    this.startBluetoothDevicesDiscovery();\n  }\n})",
  "after": "",
  "message": "wx.onBluetoothAdapterStateChange:沒有相對應的(de)函數"
}]

開發工具轉換

轉換結果

嘗試了(le／liǎo)幾個(gè)項目，都能轉成百度小程序，但一般無法正常運行，需要(yào / yāo)手動修改幾處阻塞的(de)問題之(zhī)後才能往下進行。

遇到(dào)的(de)幾個(gè)問題：

1. 不(bù)支持 require('utils.js') 這(zhè)種相對路徑的(de)寫法，需要(yào / yāo)手動改成 require('./utils.js')
2. 不(bù)支持 require 變量，需要(yào / yāo)避免
3. 不(bù)支持 plugin, 需要(yào / yāo)将其從 usingComponents 中移除，否則編譯報錯
4. 不(bù)支持微信小程序的(de) miniprogram_npm， 需要(yào / yāo)手動修改 require 的(de)路徑
5. 轉換工具會直接删除不(bù)支持的(de) API， 需要(yào / yāo)留意轉換報告

解決完阻塞問題後的(de)效果對比：

微信 => 支付寶

轉換工具：

1. wx2my 
2. Antmov

wx2my

wx2my 支持 npm 命令行和(hé / huò) vscode 插件形式。

npm 命令行

npm i -g wx2my
wx2my wxmp

容易出(chū)現“轉換失敗”的(de)提示，不(bù)過還是(shì)有轉換代碼生成。

不(bù)支持的(de) api 隻會在(zài)報告中體現，不(bù)會擅自删除代碼。

生成的(de) todo.html 信息較爲(wéi / wèi)豐富，還可以(yǐ)跳轉到(dào)文檔。

vscode 插件形式

1. 搜索安裝插件 wx2my
2. 打開 vscode 命令面闆輸入 wx2my 或者直接在(zài)文件欄 app.json 右鍵選擇 wx2my

轉換結果

Antmove

Antmove 支持多種小程序間的(de)相互轉換。

npm 命令行形式：

npm i -g antmove
antmove wx-alipay -i IQOO_wx -o IQOO_my --env development

轉換報告顯示轉換得很成功。

vscode 插件形式

1. 搜索安裝插件 Antmove
2. 打開 vscode 命令面闆輸入 Antmove: Run antmove wx-alipay
3. 選擇輸出(chū)路徑

轉換結果

雖然轉換報告顯示完全轉換，但是(shì)其實在(zài) IDE 中無法正常預覽。編譯中有阻塞性的(de)報錯。因爲(wéi / wèi)微信小程序的(de) plugin 在(zài)支付寶中是(shì)無法使用的(de)，導緻編譯報錯。

暫時(shí)删除引用的(de) plugin 後，頁面可以(yǐ)大(dà)緻展示出(chū)來(lái)：

微信 => 快應用（兼容版）

微信小程序轉換快應用（兼容版）也(yě)支持兩種形式轉換

npm 命令行
IDE 插件

詳細教程： 微信小程序轉快應用工具

npm 命令行

1. npm i -g qa-adapter
2. adt [sourceDir] [destDir?optional]
3. 會自動彈出(chū)轉換報告 report.html
4. 在(zài)快應用開發工具中打開預覽

IDE 插件

1. 快應用中搜索安裝插件 hap-transformer
2. 命令面闆，輸入 hap:transfer wechat miniprogram into Quick App
3. 輸入源碼路徑和(hé / huò)輸出(chū)路徑,點擊“轉換”

轉換效果

在(zài) IDE 中打開一樣遇到(dào)了(le／liǎo) plugin 報錯問題，手動把 plugin 删除後就(jiù)可以(yǐ)正常預覽頁面：

總結

1. 目前市面上(shàng)的(de)小程序語法、框架、組件、接口都非常相近，利用轉換工具，可以(yǐ)非常快速地(dì / de)實現小程序多端開發、上(shàng)線。代碼轉換基本是(shì)分分鍾的(de)事
2. 各轉換工具大(dà)差不(bù)差，大(dà)都支持 npm 命令行的(de)模式，輸入命令一鍵轉換
3. 利用轉換工具生成的(de)目标代碼，和(hé / huò)原來(lái)的(de)代碼結構一緻，具有非常好的(de)可讀性，方便對目标平台做針對性的(de)修改
4. 現有的(de)轉換工具還沒有完全覆蓋微信的(de)特性，有些微信特有的(de)功能（比如 plugin，miniprogram_npm 等），沒有很好的(de)轉換或者提示，需要(yào / yāo)人(rén)爲(wéi / wèi)手動修改
5. 微信小程序轉快應用工具 提供了(le／liǎo)另外一種快速接入快應用的(de)方式，而(ér)無需學習新語法
6. 各小程序(快應用)平台差異在(zài)所難免（比如百度不(bù)支持 require('utils.js') 這(zhè)種相對路徑的(de)寫法、微信的(de) plugin 不(bù)被其他(tā)平台支持），所以(yǐ)如果要(yào / yāo)考慮多端，需要(yào / yāo)盡量采用比較通用的(de)特性和(hé / huò)寫法，減少轉換後的(de)修改工作