微信小程式開發環境搭建
微信小程式可謂是今天最火的一個名詞了,一經出現真是轟炸了整個開發人員,當然很多App開發人員有了一個擔心,微信小程式的到來會不會給移動端App帶來一個寒冬,身為一個Android開發者我是不相信的,他只不過提供了一個新的流量入口,給一些企業多了一種選擇,即使有,那也是很遙遠的未來。
不管微信小程式是否能顛覆當今的開發格局,我們都要以好奇的心態去接收,去學習。不排斥新技術,所以,心動不如行動,趕緊先搭建一個微信小程式開發工具。那麼接下來就讓我們一起來開始吧。
微信已於9月23號晚釋出了最新開發工具,以及官方文件,新版開發工具支援無appid登入開發者工具,所以可去官網直接下載使用。官網地址
本人目前要做一款仿 QQ的小程式,正在持續更新中
目前專案更新狀態:歡迎大家star專案啊,共同學習
訊息頁面:
聯絡人頁面:
動態頁面:
開發工具下載到GitHub上的分享。那麼你可以直接進入該GitHub,找下載連結即可下載。
當然我把安裝順序以及遇到的問題在此詳細介紹一下。(接下來按照此步驟安裝即可成功(windows版))
下載微信小程式開發工具0.7.0版本(下載連結http://pan.baidu.com/s/1nuIJnBV密碼:ru3h)因為0.9.0版本有登陸驗證,直接安裝一直登陸不上,一直提示please bind your wechat account to the appid first
然後下載0.9.0版本(下載連結http://pan.baidu.com/s/1hskDLZY 密碼46gv)
下載後直接覆蓋安裝就可以了(要覆蓋安裝),安裝後先不用開啟開發工具,即使你想開啟也進不去。直接登入會出現如下提示
我將工具安裝到D盤了,分別找到下面三個目錄替換對應檔案即可
D:\微信web開發者工具\package.nw\app\dist\components\create\createstep.js
D:\微信web開發者工具\package.nw\app\dist\stroes\projectStores.js
D:\微信web開發者工具\package.nw\app\dist\weapp\appservice\asdebug.js
替換檔案後即可登入成功了,登入後介面如下
那麼我們直接點選新增專案,點選後介面
因為我們沒有內測賬號,這個appid可以隨便輸入,專案名稱,及開發目錄就隨便寫了。
填好資訊後點擊新增專案
OK,神奇的事情出現了,一個helloworld專案就出現了。
點選編輯
選擇對應的檔案即可編寫程式碼了。
除錯
點選除錯按鈕,左上有可以選擇除錯的移動終端,裡面可以選擇蘋果,三星及其他不同解析度裝置。裝置右邊有選擇網路的按鈕,可以選擇wifi,2G,3G,4G網路。在右邊的視窗,有console可以檢視控制檯列印的資訊,以及網路,儲存資訊等。
我們點選最右上角按鈕,與選擇顯示console,查詢檔案,快捷鍵,以及感測器,渲染設定,幫助等。在左下角有清楚快取,重啟小程式,按鈕。
對了GitHub有個demo,我們可以把這個demo複製到我們的開發目錄下,看下微信小程式效果,剛才建立的是一個helloworld,太簡單,看不出它的魅力。
動態圖我放到前面了。
好了就簡單介紹到這裡,想了解更多內容,請看開發文件