搞了幾個月的Vuejs,也是時候開始搞搞基于Vuejs文法的Weex App了。
這裡做個廣告,最近用vuejs開發了一個小系統(前後端分離),架構有參考Oracle EBS,功能/職責随便配置。有興趣的兄台可以了解一下:https://github.com/samt007/jebms-ui
來正題,什麼是Weex App?
這裡有簡介:
Weex App
阿裡巴巴開發團隊在RN的成功案例上,重新設計出的一套開發模式,站在了巨人肩膀上并有淘寶團隊項目做養料,廣受關注,2016年4月正式開源,并在v2.0版本官方支援Vue.js,與RN分庭抗禮。
優點:單頁開發模式效率極高,熱更新發包體積小,并且跨平台性更強
缺點:剛剛起步,文檔欠缺;社群沒有RN活躍,功能尚不健全,暫不适合完全使用Weex開發App
舉個栗子:淘寶、天貓、阿裡雲、優酷、閑魚、餓了麼等
推薦看的文章:https://segmentfault.com/a/1190000011154120
Weex淘寶官方首頁:https://weex-project.io/cn/
好了,現在開始搭建開發環境吧!
這個是用筆記本新安裝一個環境(這個環境基本是空白的,隻是有安裝nodejs而已),系統版本:Win10。大概步驟:
-
安裝Java開發環境,Android Studio工具等。
首先安裝好java的開發環境JDK。我用1.8版本,接着必須要全部配置好環境變量。反正最後用cmd輸入java –version和javac能識别就OK。有一點要說明的,修改了系統的環境變量,要生效的一個簡單辦法就是重新開機電腦。。。當然也有别的辦法,但是貌似都比較折騰,還是重新開機簡單直接!
然後就是下載下傳Android Studio工具。這個碰到一個小插曲,Win10直接安裝百度搜尋的1.8G的版本會報錯(報錯是安裝軟體的完整性檢測有問題)。後來換一個版本下載下傳就OK,建議在這裡下載下傳:http://www.android-studio.org/
上面的安裝教程可以參考這個網址:https://www.cnblogs.com/jliangqiu2016/p/5656676.html
安裝AS工具時間是最長的,确實麻煩,而且要下載下傳的東西也很多,特别是Android SDK。必須要注意磁盤空間要足夠啊。
另外,安裝好之後,還要配置一下ANDROID_HOME等的環境變量哦。
-
接着就是安裝Weex。
基本按照官網的步驟安裝就行。因為我之前安裝了nodejs,這裡隻需要更新一下npm版本就OK啦。指令:npm i [email protected] -g
接着就是安裝weex toolkit。安裝要注意:要先執行安裝指令,再執行更新的指令(官網都有對應指令)。
執行更新指令的時候碰到一個問題:沒python運作環境。是以,又馬不停蹄地下載下傳了一個python(安裝之後還要配置好系統環境變量path哦。。。)
但是更新weex toolkit還是報錯,網上百度了一下,原來我還是少安裝了這個東西:Windows Studio。是以,又安裝了一個Windows Studio 2013版本。(下面所說的碰到的主要問題也有提及到)。其實我有記得公司電腦是有安裝的,記憶比較深刻,當時搞的React Native運作環境,估計也是一樣的原因。
-
碰到的主要問題:
首先,要用這個辦法開發手機app(就是js驅動原生界面),如果是Windows環境,必須得安裝python,而安裝python必須得安裝Windows Studio,我安裝是2013版本的,否則例如更新weex update [email protected],會報錯。
電腦環境變量截圖:
![](https://img.laitimes.com/img/_0nNw4CM6IyYiwiM6ICdiwiI0NXYFhGd192UvwVe0lmdhJ3ZvwFM38CXlZHbvN3cpR2Lc1TPB10QGtWUCpEMJ9CXsxWam9CXwADNvwVZ6l2c052bm9CXUJDT1wkNhVzLcRnbvZ2Lc1TP350dBREZ0ZkMjZXUYpVd1kmYr50MZV3YyI2cKJDT29GRjBjUIF2LcRHelR3LcJzLctmch1mclRXY39TM1QzM1QDM0EzMwITM3EDMy8CX0Vmbu4GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.jpg)
weex的項目,直接用Android Studio IDE打開:
沒問題的話,随便在AS工具裡面打包apk,就可以安裝使用啦!
安裝總結:有問題基本的解決思路是,根據錯誤資訊問度娘,一般都可以有解決辦法。你要相信,一般來說,你不會是第一個碰到該問題的人!