#### 加快小程式開發的幾個小建議 > 1.使用 `app.json`建立頁面 ​ 按照我們平常的開發習慣，建立一個新的頁面，一般都會先建立資料夾，再建立對應`page`的形式，建立完成後，`app.json`中會自動註冊該頁面。實際上，我們還可以通過直接在`app.json`中註冊頁面來生成對應的`page`。 ~~~json "pages": [ "pages/index/index", "pages/newpage/newpage" ], ~~~ ​ 如上所示，在配置檔案中註冊該路徑，小程式就會自動建立該對應路徑。 > 2.善用編譯模式  ​ 我們想要除錯某個頁面時，相當一部分開發者習慣於直接修改`app.json`來調整首個入棧頁面，實際上完全可以使用編譯模式新增編譯頁面，來代替修改配置檔案的行為。 > 3.元件複用小程式樣式 ​ 這一點經常被遺忘，因為新建`component`的時候，小程式並不會展示該配置項。配置`options`如下，元件可以使用全域性樣式(`app.wxss`) ~~~js Component({ //繼承colorui樣式 options: { addGlobalClass: true, multipleSlots: true }, ... } ~~~ > 4.`app.js`初始化內容函式化 ​ 很多小程式`onLaunch`中寫著大量的內容，混亂不堪，後期除錯尤為痛苦。可以將不同的初始化內容寫為不同的函式，函式化、模組化。 ~~~json onLaunch: function(options) { //此處需要有對進入小程式方式的處理 this.InitCloud(); //初始化雲服務 / ESC this.InitCustom(); //初始化custom所需配置資訊 this.InitEdu(); //初始化教務系統配置 }, ~~~ > 5.善用`template` ​ 對於內容大量重複的`wxml`內容，可以將之抽離為`template`模板檔案，使用時直接匯入使用即可。 ~~~html

~~~ > 6.雲開發混合開發 ​ 內容安全識別，openid獲取，圖片鑑黃，支付流程，內容推送這些東西如果使用自己的後臺實現，並不是這麼簡單，但是如果使用了雲開發的技術替換這一部分，自己專注於業務邏輯，你會開啟一片新天地。 雲開發部分功能（後面我會專門寫一篇文章介紹雲開發混合開發的內容）： ~~~js const cloud = require('wx-server-sdk') cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV }) // 雲函式入口函式 exports.main = async (event, context) =>

{ // console.log(event) switch (event.action) { case 'getWXACode': { return getWXACode(event) } case 'getOpenData': { return getOpenData(event) } case 'msgSecCheck': { return msgSecCheck(event) } case 'imgSecCheck': { return imgSecCheck(event) } case 'submitPages': { return submitPages(event) } default: { return } } } //獲取小程式碼 async function getWXACode(event) { console.log(event.url) // 此處將獲取永久有效的小程式碼，並將其儲存在雲檔案儲存中，最後返回雲檔案 ID 給前端使用 const wxacodeResult = await cloud.openapi.wxacode.get({ path: event.url || 'pages/index/index', }) const fileExtensionMatches = wxacodeResult.contentType.match(/\/([^\/]+)/) const fileExtension = (fileExtensionMatches && fileExtensionMatches[1]) || 'jpg' const uploadResult = await cloud.uploadFile({ // 雲檔案路徑，此處為演示採用一個固定名稱 cloudPath: `wxCode/wxCode${Math.random() * 9999999}.${fileExtension}`, // 要上傳的檔案內容可直接傳入圖片 Buffer fileContent: wxacodeResult.buffer, }) if (!uploadResult.fileID) { throw new Error(`上傳失敗，檔案為空，儲存伺服器狀態程式碼為空 ${uploadResult.statusCode}`) } return uploadResult.fileID } // 獲取openid async function getOpenData(event) { // 需 wx-server-sdk >

= 0.5.0 const wxContext = cloud.getWXContext() return { event, openid: wxContext.OPENID, appid: wxContext.APPID, unionid: wxContext.UNIONID, } } // 檢測文字是否合規 async function msgSecCheck(event) { // 需 wx-server-sdk >= 0.5.0 return cloud.openapi.security.msgSecCheck({ content: event.content, }) } // 檢測圖片是否合規 async function imgSecCheck(event) { return cloud.openapi.security.imgSecCheck({ media: { contentType: event.contentType, value: Buffer.from(event.value) } }) } // 收錄頁面 async function submitPages(event) { return cloud.openapi.search.submitPages({ pages: [{ path: event.path, query: event.query }] }) } //獲取日期 function getDateTime(sj) { var now = new Date(sj * 1000); var year = now.getFullYear(); var month = now.getMonth() + 1; var date = now.getDate(); var hour = now.getHours(); var minute = now.getMinutes(); // var second = now.getSeconds(); return year + "年" + month + "月" + date + "日"; } ~~~ > 7.將個人配置資料集中到一個檔案中 ​ 比如說伺服器域名、介面令牌這些可能會變化，但經常使用的資料，集中到一個檔案中。 ~~~js module.exports={ UseCloud:true, CloudId:'', //雲開發環境id TraceUser:true, //記錄使用者訪問日誌 AdaptStorge:true, //允許快取使用者資料 SevDomain:'http://localhost' //伺服器的域名 } ~~~ > 8.善用開發者工具的版本管理工具 ![](https://img2020.cnblogs.com/blog/1141382/202012/1141382-20201227214349951-17148044