小程序開發入坑之旅

本篇文章並不會徹底從開發的角度描述如何開發一個小程序，畢竟官方的文檔已經很齊全了 戳這裏看官方文檔：https://mp.weixin.qq.com/debug/wxadoc/dev/。

本文會從如何快速上線一個小程序的角度來進行闡述。主要分文如下幾個方面。

• 從零開始構建一個小程序
• 小程序測試、上線
• 小程序開發、上線過程當中常見問題
• 使用第三方快速構建小程序。
• 使用wepy構建小程序

從零開始構建一個小程序

這一步基本要靠官方文檔，並且文檔很全面，主要分爲四個步驟。

• 註冊小程序
• 小程序基本框架
• 外部api

註冊小程序

登陸小程序後臺註冊一個小程序，註冊完畢後，記錄下APPID，並配置記錄下後臺接口服務的域名，服務器域名及小程序的後臺服務，小程序是一個先後臺高度分離的項目，全部數據除了調用第三方（主要是微信提供的api）的接口外就是調用本身業務系統的接口了。這裏配置的就是本身業務系統接口地址。

下載小程序開發工具，新建項目，而且錄入剛纔的APPID，另外小程序要求後臺接口服務器域名必須是https服務，若是開發工程中暫時未申請好https證書也沒問題，能夠在小程序開發工具設置「不校驗安全域名、TLS版本及HTTPS證書」。

具體，參考官方文檔：https://mp.weixin.qq.com/debug/wxadoc/dev/

小程序基本框架

這方面信息官方文檔也有詳細介紹：https://mp.weixin.qq.com/debug/wxadoc/dev/framework/MINA.html。 這裏簡單說明下：小程序開發的基本模式。

• 全局配置：

  • 首先有個app.json配置了系統的全局參數，包括但不限於：
    • pages，小程序包含的全部頁面路徑
    • window，小程序窗口基本樣式
    • tabBar：小程序的主導航菜單（可選配，不配置的話頂部或者底部就沒有菜單）。
    • 其餘配置，還有其餘一些選配選項，這裏不一一贅述
  • app.js 小程序的全局生命週期相關動做能夠在此編寫，好比小程序初次啓動的時候、銷燬時等要作的事情能夠在這個js中編寫。
  • app.wxss 小程序的全局樣式，至關於html中的公共樣式文件，全部頁面都引用該樣式文件。

• 各頁面開發 官方規範小程序頁面包含wxml,wxss,js三個文件，分別對應：頁面、樣式、js（業務邏輯）。固然你也能夠將全部內容都卸載wxml中經過style和script引入樣式和js，只是不建議這麼作，頁面複雜的時候不方便維護。

小程序測試、上線

小程序測試

小程序開發工具自己自帶了預覽功能，開發工程中能夠實時看到頁面效果，也能夠經過「預覽」按鈕生成的小程序碼，用微信掃描預覽小程序。 測試過程當中充分利用小程序的控制檯，能夠很方便的作調試。

小程序上線

小程序上線過程自己很簡單，在小程序開發工具上點擊「上傳」按鈕就會將小程序上傳到小程序管理後臺；而後登陸小程序管理後臺進行發佈版本便可，剩下的就交給微信團隊審覈了通常須要3-5天，節假日順延。

小程序開發、上線過程常見問題

開發過程的問題

• 開發過程當中可能涉及後臺接口的調整爲了不頻繁調整、上線後臺服務，能夠在開發過程當中將接口地址設置爲本地，而且取消開發工具的https驗證，這樣能夠提升開發調試效率。
• 對於不一樣屏幕的適配，在開發過程當中，對於同一個頁面應常常針對不一樣手機類型模擬器進行全面測試，開發工具提供了不一樣手機類型模擬器，很方便的測試。
• 也許常常會遇到一些新增的頁面連接沒有效果或者打不開，不用急，檢查下app.json中的pages配置，也許你忘了將新增的頁面配置到pages中了。（嗯，沒錯，說的就是我本身 ~捂臉~）

上線問題

剛纔說了上線過程自己並不複雜，可是要注意小程序的名稱、描述和小程序中涵蓋的內容，目前小程序審覈很是嚴格，要避免被打回來，好比下面常見打回狀況。

• 我的賬號的小程序不能包含：新聞、論壇、社區、招聘等字樣
• 小程序的類目選擇不當
• 小程序中不要放不完善或者體驗的功能，好比連接打不開、音樂、視頻播放不了，圖片加載不了、服務接口響應太慢。

關於常見問題後續開發過程當中遇到了再補充完善。

使用第三方快速構建小程序

其實上線一個小程序不少時候不須要本身開發，徹底可使用第三方的服務網上還有不少其餘的第三方小程序生成器，目前我只試用太輕芒小程序+，體驗還不錯；後期試了其餘家的再補充。

使用wepy構建小程序

最後，隆重推薦wepy，wepy是一個小程序的組件化開發框架，更貼近於目前有MVVM框架開發模式。使用它開發過程能夠拋棄微信官方的小程序開發工具，只是在測試預覽的時候使用它。 並且後期代碼移植爲h5也比較方便。並且wepy是微信官方出品，不用擔憂支持問題，具體使用方式這裏不贅述，能夠查看其官方文檔：https://tencent.github.io/wepy/