国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

Weex系列(1) ——Hello World項目

xiaowugui666 / 3506人閱讀

摘要：由于最開始沒有一點點原生開發的經驗，所以我就直接用的腳手架初始化項目。那下面我們就從最最原始的項目開始吧，序篇太枯燥，自由發揮時間開始啦。執行如下代碼，最后會得到如圖的項目結構。入口文件等簡析進行了初始化。

目錄

Weex系列(序) —— 總要知道原生的一點東東(iOS)

Weex系列(序) —— 總要知道原生的一點東東(Android)

Weex系列(1) —— Hello World項目

Weex系列(2) —— 頁面跳轉和通信

Weex系列(3) —— 單頁面還是多頁面

[Weex系列(4) —— 老生常談的三端統一]

[Weex系列(5) —— 封裝原生組件和模塊]

[Weex系列(6) —— css相關小結]

[Weex系列(7) —— web組件和webview]

[Weex系列(8) —— 是時候簡析一下流程原理了]

[Weex系列(9) —— 踩坑填坑的集錦]

[Weex系列(10) —— 先這么多吧想到再寫。。。]

由于最開始沒有一點點原生開發的經驗，所以我就直接用的腳手架初始化項目。那下面我們就從最最原始的Hello World項目開始吧，序篇太枯燥，自由發揮時間開始啦。

weex-toolkit

執行如下代碼，最后會得到如圖的項目結構。

有的同學會繼續用官網的weex run ios或者android開始運行項目，大多數人應該都運行不起來，我就是這大多數人，我是直接用原生工具運行對應App的，如iOS，直接用xcode打開WeexDemo.xcworkspace這個文件。(這里還有一個點，如下代碼最后需要pod install下，安裝weex sdk等包)

接下來就可以愉快的開發代碼了，調試就該登場了，那就下一個點吧。

npm install -g weex-toolkit
weex create helloworld
cd helloworld
weex platform add ios
weex platform add android

cd platforms/ios
pod install

Weex Playground

接上面最后一個點，輸入如下代碼，就會看到瀏覽器自動打開一個網址，然后下載標題上的這個App掃描二維碼就可以進行調試了

weex debug src/index.vue

bundlejs

第一個命令就是把src目錄下我們寫的代碼打包到dist目錄下，會對應生成xxx.js和xxx.web.js，xxx.js是原生所要用到的js，xxx.web.js是給web端用的，這就是三端統一的第一步。

后面兩個命令其實就是打包同時把打包后的代碼放到截圖對應的原生目錄下，這兩個命令比較慢，我通常都是用終端的復制文件夾的功能直接復制代碼到對應目錄下。

weex build web
weex build ios
weex build android

bundlejs的路徑問題

還是把這個多帶帶拿出來講一下吧，網上有好多版本的一統三端的js路徑等，其實總結起來就是：
iOS：能拿到weex.config.bundleUrl(我這邊是file:///var/containers/Bundle/Application/4D5A8D6F-2824-4603-936B-B77418600858/WeexDemo.app/bundlejs/index.js)能取到上面截圖bundlejs目錄地址，再做相對處理即可。
Android：weex.config.bundleUrl拿到的地址形式不統一，最后就是寫死的file://assets/dist
web：weex run web的時候瀏覽器會自動打開一個地址，可以研究這個地址再做一下調整。
后續章節可以把這個方法提供給大家參考。

iOS入口文件等簡析

AppDelegate.m執行了初始化weex環境的方法，這個方法里面還可以注冊我們封裝的模塊和組件，weex腳手架初始化的項目還提供了啟動頁的方法，我們可以稍作修改換成我們自己的動畫。

WeexSDKManager就是官網上的初始化weex環境的步驟。

WXDemoViewController加載了我們上面提到的打包后的js。

[WXSDKEngine registerModule:@"xxx" withClass:[xxx class]];
[WXSDKEngine registerComponent:@"xxx" withClass:[xxx class]];

Android入口文件等簡析

WXApplication進行了初始化。

AbsWeexActivity封裝了渲染加載js的方法，在WXPageActivity可以看到有調用createWeexInstance和renderPageByURL得方法。

Hello World就先講這么多吧，第一次寫系列文章，終于把開頭三章搞定了，如果大家對我的專欄有一點點興趣，就請點個贊哦，歡迎收藏繼續關注，謝謝。

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/99074.html

相關文章

  • WEEX系列 環境搭建

    摘要：系列文章之環境搭建和一步一起從前端視角聊一聊如果你只想試試的語法寫個啥的，在線編輯器上玩玩就夠了。如果你想更深入的學習，顯然是需要搭建本地開發環境的。腳手架讓我們更專注于業務代碼，節約開發環境構建成本，提供一定的靈活。 WEEX系列文章之環境搭建 和一步一起從前端視角聊一聊WEEX 如果你只想試試 weex 的語法寫個 hello world 啥的， 在dotWe線編輯器上玩玩就夠了。...

    teren 評論0 收藏0

  • Weex系列(4) —— 老生常談的三端統一

    摘要：剛看到這仨頁面的時候，我就想著可以用路由，做成三端統一。樣式這部分真的三端基本是高度統一的，部分微調一下就可以了，也正是這樣，我們后續才能迅速解決和。終于不是談談三端統一了，也是真的體驗了一次，雖然最后有點出入，但是下次基本是沒問題了。 目錄 Weex系列(序) —— 總要知道原生的一點東東(iOS) Weex系列(序) —— 總要知道原生的一點東東(Android) Weex系列(...

    wzyplus 評論0 收藏0

  • Weex系列(7) ——踩坑填坑的總總

    摘要：的方法在安卓底下會崩潰，結果竟然是要在里面設置正確的，因為我是用官網的腳手架搭起來的項目，不知道大家會不會遇到，改一下就可以解決問題了。 目錄 Weex系列(序) —— 總要知道原生的一點東東(iOS) Weex系列(序) —— 總要知道原生的一點東東(Android) Weex系列(1) —— Hello World項目 Weex系列(2) —— 頁面跳轉和通信 Weex系列(3)...

    toddmark 評論0 收藏0

  • Weex系列(7) ——踩坑填坑的總總

    摘要：的方法在安卓底下會崩潰，結果竟然是要在里面設置正確的，因為我是用官網的腳手架搭起來的項目，不知道大家會不會遇到，改一下就可以解決問題了。 目錄 Weex系列(序) —— 總要知道原生的一點東東(iOS) Weex系列(序) —— 總要知道原生的一點東東(Android) Weex系列(1) —— Hello World項目 Weex系列(2) —— 頁面跳轉和通信 Weex系列(3)...

    phpmatt 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<