前言
在微信小程序開發的過程中,代碼版本管理往往需要使用第三方工具進行管理。雖然微信Web開發工具
提供了對Git
文件版本狀態的提示,但實際的使用體驗依然不盡人意。
隨着微信Web開發工具
的更新,最新的內測版本已經支持Git
的直接管理,本文將就在微信Web開發工具
中使用Git
做版本管理做詳細介紹。
環境准備
-
開發環境:Mac/Windows/Linux均可
-
開發工具:微信Web開發者工具Beta版本、Git
-
Git托管服務:碼雲
使用Git
服務需要在系統上先安裝好Git
,相關Git
環境的安裝,詳見Git入門和Git的安裝。
由於目前Git
管理功能的支持尚在公測階段,故本文將使用微信Web開發者工具 Beta版本
作為示例。
訪問 https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html 即可下載 微信Web開發者工具Beta版本
(下文以微信Web開發者工具
簡稱代替)
創建小程序項目
使用Git
版本管理,首先需要有個git的倉庫。打開微信Web開發者工具
,新建/打開小程序的項目。此處以新建項目為例,假設項目名為HelloGitee
,填寫好相應路徑和appid
,選擇建立普通快速啟動模板
,確認並新建項目。
創建完成后,得到了初始化后的項目。
創建遠程倉庫
在 https://gitee.com 上登錄自己的碼雲賬號,在右上角新建按鈕選擇「新建項目」。填寫相應的項目倉庫信息。
此處我們選擇使用公開的倉庫,命名路徑為「HelloGitee」,開發語言選擇「JavaScript」。確認后點擊「創建」按鈕初始化遠程倉庫。
創建並初始化完遠程倉庫后,我們得到了一個空白倉庫如下圖。項目的倉庫地址是:https://gitee.com/normalcoder/HelloGitee.git
接下去我們將初始化本地的Git
倉庫。
初始化本地倉庫
在微信Web開發者工具
中點擊面板上的「版本管理」按鈕,將彈出開發者工具中的版本管理面板。
由於是新建項目,並沒有初始化過Git
倉庫,所以項目會提示初始化Git
倉庫,點擊「初始化 Git 倉庫」,點擊「確認」,完成本地倉庫的初始化。
這一步驟相當於執行「git init」命令。
初始化完成后,我們可以看到本地的倉庫和當前的Git狀態。下圖為微信Web開發者工具
初始化后的版本控制面板。
配置倉庫信息
初始化完成后,依次點擊「工作空間」->「設置」->「通用」->「編輯」,編輯在Git
中使用的用戶名和郵箱。這一步相當於git config
命令中的配置操作。
$ git config --global user.name "用戶名" $ git config --global user.email "郵箱"
需要注意的是:此處配置的郵箱名需要和 碼雲 https://gitee.com 上的郵箱保持一致,才能保證提交后能統計到Git的提交貢獻信息。
切換到倉庫設置的「遠程」選項卡,這時候會發現提示「未找到遠程倉庫信息」,點擊「添加」,將前面創建的遠程倉庫地址填進去,倉庫名稱此處命名為「master」,可自行命名。
添加完成后即可看到項目中的遠程分支信息。
推送代碼到遠程倉庫
點擊操作面板上的「推送按鈕」,在彈出窗口選擇「推送到新的遠程倉庫分支」,名稱填寫「master」,表示推送到遠程倉庫的master
分支,然后點擊「確定」。
推送完成后,我們可以順利的看到「遠程倉庫」下出現了分支信息。訪問碼雲
上的倉庫,也能看到推送過去的信息。此時我們已經完成了代碼從本地倉庫到遠程倉庫到推送。
注意事項 和 身份授權設置
在推送的時候如果遇到了提示推送失敗,需要檢查用戶授權,表示可能微信Web開發者工具
並沒有讀取到本地用戶的ssh授權配置,需要在開發工具中設置用戶的授權信息。
初始化完成后,依次點擊「工作空間」->「設置」->「網路與認證」->「認證方式」,可以選擇遠程倉庫的認證方式,默認為「自動」。
選擇「輸入用戶名和密碼」,在下方輸入碼雲的賬號和密碼后,再次執行推送操作即可。
修改並提交代碼
接下來我們來修改我們的項目代碼。
點擊開發工具面板的「版本管理」按鈕,關閉「版本管理」面板,打開「pages/index/index.wxml」,修改其中內容「獲取頭像昵稱」為「我的第一次修改提交」,保存。
再次切換到「版本管理」面板,可以看到當前本地分支有一個文件等待提交,選中並勾選文件,可以查看當前文件內發生的改動。
在下方提交框填寫提交的備注信息,點擊「提交」,將代碼提交到本地倉庫主干分支上。提交后,可以在本地倉庫分支上查看提交記錄。
接下去我們再次將代碼從本地分支推送到遠程倉庫。點擊操作面板上的「推送按鈕」,在彈出窗口選擇「推送到一下遠程倉庫分支」,選擇一存在的遠程master
倉庫的master
分支,然后點擊「確定」。
推送完成后,即可在碼雲對應的倉庫主頁看到提交的代碼變更。
總結
在上面的操作中,我們通過微信Web開發者工具
的版本管理功能,對小程序的代碼進行了版本的管理控制,並提交到了遠程的Git倉庫中。
在實際的項目開發中,我們還可以充分利用Git
在版本管理和協作上的特性,靈活的和他人進行協作,進而規范代碼管理,更高效的進行協作開發。