小程序基礎

1. 認識什么是小程序

什么是微信小程序

微信小程序是一種運行在微信內部的 輕量級 應用程序。

在使用小程序時 不需要下載安裝，用戶 掃一掃 或 搜一下 即可打開應用。它也體現了 “用完即走” 的理念，用戶不用關心安裝太多應用的問題。它實現了應用“觸手可及”的夢想，應用無處不在，隨時可用，但又 無須安裝卸載。

特點:

小程序的四大特性：無須安裝、用完即走、無須卸載、觸手可及

1. 無須安裝：體積小，用戶感知不到下載的過程
2. 觸手可及：用戶 掃一掃 或 搜一下 即可打開應用，通過下拉能訪問使用的小程序
3. 用完即走，無須卸載
   

2. 微信小程序賬號注冊

小程序開發 與 網頁開發不一樣，在開始微信小程序開發之前，需要訪問 微信公眾平臺，注冊一個微信小程序賬號。

在擁有了小程序的賬號以后，我們才可以開發和管理小程序，后續可以通過該賬號進行開發信息的設置、成員的添加，也可以用該賬號查看、運營小程序的相關數據。

📌 注意事項：

在申請賬號前，我們需要先準備一個郵箱，該郵箱要求：

1?? 未被微信公眾平臺注冊?

2?? 未被微信開放平臺注冊?

3?? 未被個人微信號綁定過 ！如果被綁定了需要解綁 或 使用其他郵箱 ?

1. 打開 微信公眾平臺，點擊立即注冊
   

2. 選擇注冊的帳號類型，在這里我們需要 選擇小程序

3. 輸入賬號信息

4. 郵箱激活，需要進入郵箱進行激活
   

5. 信息登記，注冊類型 (需要選擇中國大陸和個人，企業其他需要資質認證)
   

6. 主體信息登記與確認

   📌 注意:

   ? 在進行管理員身份驗證的時候，推薦使用自已的微信進行掃碼，

   ? 將自已設置為小程序賬號的管理員，方便以后對小程序進行開發、成員等相關的設置
   
   

7. 小程序注冊完成，點擊前往小程序，即可進入小程序后臺
   
   

3. 完善小程序賬號信息

在完成小程序賬號的注冊后，你便可以打開微信公眾平臺對小程序賬號進行一些設置，這是你開發前的準備工作，完善后才可以進入后續的開發步驟，這是因為小程序在后續進行提交審核的時候，小程序賬號信息是必填項，因此在注冊小程序以后，需要補充小程序的基本信息，如名稱、圖標、描述等。

📌 注意事項：

? 在填寫小程序類目時不要選擇游戲類型，否則微信官方將會視為小游戲開發 ?

點擊 前往填寫，填寫小程序基本信息即可

點擊 前往設置 , 設置小程序類目信息

1. 點擊右上角添加類目
   

2. 管理員授權
   

3. 手機微信進行認證
   

4. 添加小程序類目，注意：選擇類目的時候不要選擇小游戲類目 ！！！！
   
   

4. 小程序開發者 ID

小程序的開發者賬號是免費的，只要開發者滿足開發資質就可以免費注冊，并且會獲得對應的開發者 ID

一個完整的開發者 ID 由 **小程序 ID（AppID）**和一個 **小程序密鑰（AppSecret）**組成。

小程序 ID 即 AppId 是小程序在整個微信賬號體系內的唯一身份憑證，后續在很多地方都會用到，例如：新建小程序項目、真機調試、發布小程序等操作時，必須有小程序 ID。

小程序密鑰 是開發者對小程序擁有所有權的憑證，在進行 微信登錄、微信支付，或進行發送消息等高級操作時會使用到

在微信公眾后臺，單擊左側開發標簽，選擇 “開發管理”，在新的頁面中點擊 “開發設置”，就可以看到開發者 ID 信息。請妥善保管你的小程序 ID 和小程序密鑰，在后續的開發中會經常使用到，獲取位置見下圖：

5. 開發成員和體驗成員

小程序提供了兩種不同的成員角色：項目成員 和 體驗成員

項目成員：參與小程序開發、運營的成員，可登陸小程序管理后臺，包括運營者、開發者及數據分析者。管理員可在“成員管理”中添加、刪除項目成員，并設置項目成員的角色。

體驗成員：參與小程序內測體驗的成員，可使用體驗版小程序，但不屬于項目成員。管理員及項目成員均可添加、刪除體驗成員。

6. 微信開發者工具

為了幫助開發者簡單和高效地開發和調試微信小程序，微信官方提供了 微信開發者工具，利用開發者工具可以很方便地進行小程序開發、代碼查看以及編輯、預覽和發布等功能。

在 微信開發者工具 下載頁面，可以看到微信開發者工具包含三個版本：

1. 穩定版：穩定性高，開發中一般推薦大家使用穩定版本

2. 預發布版：穩定性尚可，一般包含新的、大的特性，通過了內部測試

3. 開發版：穩定性差，主要用于盡快修復缺陷和敏捷上線小的特性，如果想體驗新特性，可以使用這個版本
   

選擇合適的版本進行下載，在下載完成后，雙擊下載好的微信開發者工具安裝包，根據引導點擊下一步、我接受、直至安裝完成。第一次使用微信開發者工具的時候，需要使用手機微信掃碼登錄，登錄成功即可進入項目選擇界面

📌 注意事項：

? 微信開發者工具必須聯網使用 ?

8. 創建小程序項目

創建項目

使用小程序開發者工具創建一個新的項目，步驟如下：

1. 打開微信開發者工具，左側選擇小程序，點擊 + 號即可新建項目
   

2. 在彈出的新頁面，填寫項目信息

   • 項目名稱：輸入項目名稱
   • 目錄：選擇小程序開發文件夾，注意：小程序的目錄建議是空目錄，否則官方會有提示，見下圖
   • AppID：填寫自己申請的小程序 AppID
   • 開發模式：選擇小程序
   • 后端服務：選擇不使用云服務
   • 模板選擇：選擇不使用模板
     
     

3. 點擊確定，如果能夠看到小程序的開發主界面，說明小程序項目已經創建成功
   

開發者工具設置

為了后續高效的對小程序項目進行開發，我們需要對微信開發者工具進行一些個性化的設置，例如：設置模擬器位置、編輯器主題、編輯區行高等，當然你可以繼續使用官方默認的，也可以按照自己的喜好設置，設置步驟如下：

1. 將小程序模擬器移動右側：點擊菜單欄的 視圖 ? 外觀 ? 將模擬器移到右側，小程序模擬器即可調整到右側
   
   

2. 小程序主題設置，點擊菜單欄的 設置 ? 外觀設置 ? 在彈框中將主題和調試工具選擇為深色
   
   

3. 編輯區的設置，點擊菜單欄的 設置 ? 編輯器設置 ? 按照自己的洗好調整行距和字號，或者其他設置
   

9. 小程序目錄結構和文件介紹

在將小程序項目創建好以后，我們先來熟悉小程序項目的目錄結構，如下圖：

一個完整的小程序項目分為兩個部分：主體文件、頁面文件

主體文件 又稱小程序全局文件，顧名思義，全局文件能夠作用于整個小程序，影響到小程序的每個頁面，且主體文件必須放到項目的根目錄下，主要由三部分組成：

文件名	作用	是否必須
app.js	小程序入口文件	必須
app.json	小程序的全局配置	必須
app.wxss	小程序的全局樣式	非必須

頁面文件 是每個頁面所需的文件，小程序頁面文件都存放在 pages 目錄下，一個頁面一個文件夾，每個頁面通常由四個文件組成，每個文件只對當前頁面有效：

文件名	作用	是否必須
.js	頁面邏輯	必須
.wxml	頁面結構	必須
.wxss	頁面樣式	非必須
.json	頁面配置	非必須

📌 注意事項：

1. 頁面文件，wxss、json 文件能夠覆蓋主體文件中的樣式和配置
2. 強烈建議：頁面文件夾名稱和頁面文件名稱要保持一致 感嘆號

新建小程序文件和文件夾作用清單：

├─pages	                    ? 小程序頁面存放目錄
│
│  ├─index				   ? index 文件夾代表是 index 頁面所需的文件
│  │      index.js          ? index 頁面邏輯
│  │      index.json        ? index 頁面配置
│  │      index.wxml        ? index 頁面結構
│  │      index.wxss        ? index 頁面樣式
│  .eslintrc.js              ? Eslint 配置文件
│  app.js                    ? 小程序入口，即打開小程序首頁執行的項目
│  app.json                  ? 小程序的全局配置
│  app.wxss                  ? 小程序的全局樣式
│  project.config.json       ? 小程序開發者工具配置
│  project.private.config.json
│  sitemap.json              ? 小程序搜索優化

10. 如何調試小程序

在進行項目開發的時候，不可避免的需要進行調試，那么如何調試小程序呢 ?

📌 注意事項：

微信開發者工具緩存非常嚴重????

如果發現代碼和預期不一樣，先點擊編譯?

編譯后還是沒有達到預期的效果，就需要清除緩存? 甚至重啟項目才可以?

11. 如何新建頁面

第一種方式：

1. 在 pages 目錄上 點擊右鍵 新建文件夾，輸入頁面目錄的名稱，例如：list

2. 在 list 目錄上 點擊右鍵 點擊 page，輸入頁面文件的名稱，例如：list

📌 注意事項：

1. 在輸入頁面文件名稱的時候，不要輸入后綴名 ?
2. 新建頁面成功以后，會在 app.json 的 pages 選項中新增頁面路徑

第二種方式：

在 app.json 的 pages 選項中，新增頁面路徑即可

在新增頁面目錄以后，會自動在 pages 目錄下生成頁面文件

12. 調試基礎庫

小程序調試基礎庫是指 微信開發者工具中可以選擇的微信基礎庫版本。

微信基礎庫是指小程序的運行環境，給小程序提供了運行所需的各種 API 和工具，以及基礎框架和運行邏輯等。

小程序開發者可以在微信開發者工具中選擇所需的微信基礎庫版本，作為運行和調試小程序時的運行環境。

每個小程序有自己所允許使用的基礎庫最低版本要求，開發者需要選擇要兼容的基礎庫版本，從而確保小程序的功能正常運行。