摘要:系列文章之環(huán)境搭建和一步一起從前端視角聊一聊如果你只想試試的語(yǔ)法寫(xiě)個(gè)啥的,在線編輯器上玩玩就夠了。如果你想更深入的學(xué)習(xí),顯然是需要搭建本地開(kāi)發(fā)環(huán)境的。腳手架讓我們更專注于業(yè)務(wù)代碼,節(jié)約開(kāi)發(fā)環(huán)境構(gòu)建成本,提供一定的靈活。
WEEX系列文章之環(huán)境搭建
和一步一起從前端視角聊一聊WEEX
如果你只想試試 weex 的語(yǔ)法寫(xiě)個(gè) hello world 啥的, 在dotWe線編輯器上玩玩就夠了。如果你想更深入的學(xué)習(xí), 顯然是需要搭建本地開(kāi)發(fā)環(huán)境的。
本小結(jié)內(nèi)容:安裝官方腳手架weex-toolkit、下載Weex Playground、解決瀏覽器跨域問(wèn)題。
腳手架讓我們更專注于業(yè)務(wù)代碼,節(jié)約開(kāi)發(fā)環(huán)境構(gòu)建成本,提供一定的靈活。同時(shí)呢,在能力沒(méi)達(dá)到一定的水平時(shí)候,不建議去亂搞這些東西。但,像webpack這種工具還是需要學(xué)習(xí)和掌握的。 weex-toolkit對(duì)于weex,就相當(dāng)于create-react-app對(duì)react,vue-cli對(duì)于vue的地位。
安裝 weex-toolkit 的前置條件是安裝node > 6。執(zhí)行npm install -g weex-toolkit有好多網(wǎng)友不推薦大家使用 cnpm 安裝說(shuō)是有坑,大家視情況而定
順利的話,使用weex -v檢測(cè)安裝是否成功。
創(chuàng)建一個(gè) weex 項(xiàng)目weex create weex-demo
npm install
一切順利的話,再執(zhí)行 npm start 看看效果。
如果你已經(jīng)看到了 hello world,那么恭喜你,你已經(jīng)掌握了weex 50%的知識(shí)。
Weex Playground既然學(xué)習(xí)的是原生開(kāi)發(fā),我們?cè)跄芨市闹辉跒g覽器上看效果,但是身為一個(gè) FE 又不太會(huì)搞 Android Studio 和 Xcode這些原生的東西,weex 工程師足夠給力為我們提供了Playground下載應(yīng)用然后掃一掃屏幕上的二維碼,就是真的原生應(yīng)用了。這個(gè) playground的原理,可以回顧一下上篇文章中weex原理圖。只不過(guò)是咱們個(gè)人開(kāi)發(fā)機(jī)在充當(dāng) Server 的角色而已。
使用playground條件 手機(jī)和開(kāi)發(fā)機(jī)處于同一網(wǎng)段?
一個(gè)完整的項(xiàng)目怎能少了網(wǎng)絡(luò)請(qǐng)求。在瀏覽器上調(diào)試的時(shí)候,很可能會(huì)遇到跨域的問(wèn)題,前端可以通過(guò) webpack-dev-server轉(zhuǎn)發(fā)一下請(qǐng)求,后端服務(wù)是不會(huì)出現(xiàn)跨域屏蔽的,跨域只是瀏覽器的一種保護(hù)機(jī)制,但是感覺(jué)還是有些麻煩,既然是瀏覽器限制,只要打破限制就可以了。在這里推薦大家使用chrome插件Allow-Control-Allow-Origin: *
準(zhǔn)備好上述三個(gè)環(huán)境后,我們就可以正式進(jìn)入 weex 的學(xué)習(xí)之旅了。
我的第一個(gè)weex demo
歡迎大家指正批評(píng)、或留言。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/89869.html
摘要:通過(guò)使用有限的類標(biāo)簽閹割的及基于語(yǔ)法來(lái)快速構(gòu)建原生應(yīng)用。高性能本身對(duì)加載時(shí)間和資源占用進(jìn)行了優(yōu)化。站在巨人的肩膀上,我們也很容易開(kāi)發(fā)出高性能的。我們可以把部署到服務(wù)器上實(shí)現(xiàn)熱更新。引擎運(yùn)行這些實(shí)現(xiàn)與線程通信,達(dá)到和原生應(yīng)用相同的體驗(yàn)效果。 和一步一起從前端視角聊一聊WEEX WEEX是一套構(gòu)建高性能、可擴(kuò)展的原生應(yīng)用跨平臺(tái)解決方案。就一個(gè)字吊。 通過(guò)使用有限的類HTML標(biāo)簽、閹割的CS...
摘要:有興趣的兄臺(tái)可以了解一下來(lái)正題,什么是這里有簡(jiǎn)介阿里巴巴開(kāi)發(fā)團(tuán)隊(duì)在的成功案例上,重新設(shè)計(jì)出的一套開(kāi)發(fā)模式,站在了巨人肩膀上并有淘寶團(tuán)隊(duì)項(xiàng)目做養(yǎng)料,廣受關(guān)注,年月正式開(kāi)源,并在版本官方支持,與分庭抗禮。首先安裝好的開(kāi)發(fā)環(huán)境。 搞了幾個(gè)月的Vuejs,也是時(shí)候開(kāi)始搞搞基于Vuejs語(yǔ)法的Weex App了。 這里做個(gè)廣告,最近用vuejs開(kāi)發(fā)了一個(gè)小系統(tǒng)(前后端分離),架構(gòu)有參考Oracl...
摘要:要想用好必須對(duì)基礎(chǔ),體系,打包工具有較深的了解對(duì),有了解。官方提供的腳手架不能指定入口文件,如果我們想要在項(xiàng)目中使用,沒(méi)有入口文件將會(huì)變得比較復(fù)雜。那么,我們應(yīng)該如何使得當(dāng)前項(xiàng)目具有入口文件呢答案是只能修改文件。 寫(xiě)在前面的話: 注意!該文檔是2017年年底的文章,那個(gè)時(shí)候weex還有很多問(wèn)題,現(xiàn)在weex已經(jīng)全面更新,文檔也比較全。下面的講解可能不太適應(yīng)新的weex框架,后面我會(huì)再立...
閱讀 2026·2021-08-21 14:09
閱讀 485·2019-08-30 15:44
閱讀 2114·2019-08-29 16:32
閱讀 1377·2019-08-29 15:36
閱讀 3442·2019-08-29 12:43
閱讀 2785·2019-08-29 11:14
閱讀 436·2019-08-28 18:26
閱讀 2253·2019-08-26 13:57