百度小程式開放半年多以來，作為大部分開發者，你一定是照著小程式的官方文件，用著元件和API，擼出一套程式碼釋出上線。大部分人心裡，都會有這樣的疑問：我已經有微信小程式了，能不能利用現有程式碼快速開發或者生成百度小程式？百度小程式、微信小程式、支付小程式、XX小程式等等，有沒有統一的框架，一次開發，多平臺執行？ 以下從開發百度小程式入手，給大家帶來非常規建議。
我們根據這張圖，分成不同的開發場景：
根據這張圖，我們可以看到，針對已有的微信小程式，我們可以通過搬家工具 去快速生成百度小程式，適當的二次開發修改聯調去釋出上線百度小程式；我們也可以利用 小程式應用層框架 去做跨平臺的事兒。
搬家工具
搬家工具就是針對用原生微信語法開發的微信小程式，生成百度小程式程式碼。
搬家工具，是基於 Abstract Syntax Tree 開發的輔助工具，可以幫助您把微信小程式的部分程式碼遷移到百度智慧小程式上。工具可進行靜態語法上的轉換，根據一些規則去轉換程式碼，抹平微信小程式語法和百度智慧小程式語法上的差異，為大家減少因平臺差異帶來的苦惱。
需要注意的是：工具做不到執行時diff的抹平，也做不到一個API從無到有的過程。所以，需要大家根據轉換log，進行二次開發。
搬家工具官方文件
搬家工具npm文件
搬家工具解析
應用層框架開發
小程式的開發除去常見的原生小程式語法的開發模式，還可以應用層框架開發，用類現代框架 (vue/react) 的語法去開發小程式，提升開發體驗和解決跨平臺的問題。以下我們用4個框架舉例，主要講解如何用常見的小程式框架開發百度小程式。
Taro
第一步: 安裝開發工具
安裝Taro開發工具 @tarojs/cli;
使用npm或者yarn的方式都可以獲取，也可以直接使用npx(在npm 5.2+下)
$ npm install -g @tarojs/cli
$ yarn global add @tarojs/cli
複製程式碼第二步: 初始化專案
使用命令建立模板專案
$ taro init swan-taro
複製程式碼也可以參考Taro開發百度小程式示例
第三步: 安裝依賴
進入專案目錄，安裝依賴
$ npm install
複製程式碼第四步: 構建目的碼
注：去掉 --watch 將不會監聽檔案修改，並會對程式碼進行壓縮打包
# npm script
$ npm run dev:swan // 開發模式
$ npm run build:swan // 線上模式
# 僅限全域性安裝
$ taro build --type swan --watch
$ taro build --type swan
複製程式碼第五步: 開發者工具預覽
在百度開發者工具中選擇開啟專案目錄下的dist目錄，就可以在開發者工具中預覽專案。
Tips && 文件
mpvue
第一步: 初始化專案
使用示例專案:
$ git clone git@github.com:hucq/mpvue-platform-sample.git
複製程式碼也可以參考mpvue百度小程式demo
第二步: 安裝依賴
進入專案目錄，安裝依賴
$ npm install
$ npm install mpvue@beta mpvue-loader@beta mpvue-template-compiler@beta
複製程式碼第三步: 構建目的碼
$ npm run dev:swan // 開發模式
$ npm run build:swan // 線上模式
複製程式碼第四步: 開發者工具預覽
在百度開發者工具中選擇開啟專案目錄下的dist/swan目錄，就可以在開發者工具中預覽專案。
Tips && 文件
WePY
第一步: 安裝開發工具
安裝WePY開發工具 wepy-cli;
$ npm install -g wepy-cli@1.7.3-alpha6
複製程式碼第二步: 初始化專案
使用命令建立模板專案
$ wepy init standard
複製程式碼也可以參考WePY開發百度小程式示例
第三步: 安裝依賴
進入專案目錄，安裝依賴
$ npm install
複製程式碼第四步: 構建目的碼
注：去掉 --watch 將不會監聽檔案修改，並會對程式碼進行壓縮打包
# 僅限全域性安裝
$ wepy build -o baidu --watch
$ wepy build -o baidu
複製程式碼第五步: 開發者工具預覽
在百度開發者工具中選擇開啟專案目錄下的dist目錄，就可以在開發者工具中預覽專案。
Tips && 文件
Okam
第一步：安裝 CLI 工具
- Node 安裝（要求 Node >=8 && NPM >= 3），具體安裝可以到官網下載；
- CLI 工具安裝:
$ npm install okam-cli -g
複製程式碼第二步：初始化專案
$ okam init my-project
$ cd my-project
$ npm i
複製程式碼第三步：構建目的碼
| 程式碼 | 說明 |
|---|---|
| npm run dev | 帶 watch 開發模式 |
| npm run dev:clean | 刪掉構建產物（不包括專案配置檔案）並重新構建且帶 watch 開發模式 |
| npm run dev:server | 帶 watch && 開發 Server 開發模式 |
| npm run build | 刪掉構建重新構建（沒有 watch && 開發 Server） |
| npm run prod | 生產環境構建 |
第四步：開發工具預覽
在百度開發者工具中選擇開啟專案目錄下的 dist 目錄，就可以在開發者工具中預覽專案。
更多關於 Okam 使用，可以參考 Okam 文件。