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

資訊專欄INFORMATION COLUMN

weex初探

biaoxiaoduan / 1017人閱讀

摘要:解決在文件中,多頁面配置默認(rèn)是單頁面效果,首先,真正運(yùn)行的是,通過作為入口文件文件,通過,將文件打包成進(jìn)行使用。多頁面的重點(diǎn),就是將獨(dú)立頁面的文件,生成多個(gè)文件。的入口和出口配置參考文件,創(chuàng)建一個(gè),作為的入口,用于生成頁面。

前言

RN weex hippy taro

1.Weex與RN 比較

類型 React Native Weex
思想 learn once, write anywhere write once, run anywhere
擴(kuò)展 不同平臺(tái)可自由擴(kuò)展 為了保證各平臺(tái)的一致性,一次擴(kuò)展得在各個(gè)平臺(tái)都實(shí)現(xiàn)
組件豐富程度 除了自帶的,還有js.coach上社區(qū)貢獻(xiàn)的,還是比較豐富的 基本只有自帶的10余種
調(diào)式 有專門的調(diào)試工具,chrome調(diào)試,較為完善 暫時(shí)log調(diào)試
性能 較好 較弱
上手難度 稍高 容易
核心理念 React Vue
框架程度 較重 較輕
特點(diǎn) 適合開發(fā)整體App 適合單頁面
社區(qū) 豐富,F(xiàn)acebook維護(hù) 略殘念,目前托管apache
支持 Android、IOS Android、IOS、Web
適應(yīng)性 原生開學(xué)習(xí)成本低 Web開發(fā)學(xué)習(xí)成本低
JS引擎 JSCore V8
2.weex性能

3.參考

IMWeb Conf2018 前端大會(huì): Weex內(nèi)核的原理和演進(jìn)方向:
https://www.codercto.com/a/32...
http://www.itdks.com/Course/d...

Weex 在餓了么前端的實(shí)踐
https://www.jianshu.com/p/e14...

一、問題 1.安裝

以下針對(duì)于iOS,編譯和運(yùn)行時(shí)報(bào)錯(cuò)處理:

添加特定平臺(tái)的項(xiàng)目
weex platform add ios

安裝cocopods
$ sudo gem install cocoapods

終端cd到ios項(xiàng)目,運(yùn)行pod install 或者pod update

安裝好后在執(zhí)行
$ weex run ios

2.編譯失敗

錯(cuò)誤:

./src/index.vue
Module build failed: Error: 

Vue packages version mismatch:

- vue@2.5.21 (/Users/admin/.wx/modules/node_modules/_vue@2.5.21@vue/dist/vue.runtime.common.js)
- vue-template-compiler@2.6.10 (/Users/admin/.wx/modules/node_modules/_vue-template-compiler@2.6.10@vue-template-compiler/package.json)


解決:

$ weex repair @weex-cli/core@latest
$ weex update @weex-cli/doctor
$ weex doctor

3.調(diào)試

運(yùn)行 weex debug 命令啟動(dòng)調(diào)試控制臺(tái),必須使用chrome 瀏覽器調(diào)試

4.編譯報(bào)錯(cuò)

運(yùn)行npm run dev,出現(xiàn)eslint報(bào)錯(cuò)。
解決:在config.js文件中,useEslint: false,

5.多頁面配置

https://blog.csdn.net/u012182...

Weex默認(rèn)是單頁面效果,首先,Weex真正運(yùn)行的是,通過entry.js作為入口文件文件,通過webpack,將.vue文件打包成index.js進(jìn)行使用。多頁面的重點(diǎn),就是將獨(dú)立頁面的.vue文件,生成多個(gè)js文件。
weexConfig的入口和出口配置(iOS/Android):

參考entry.js文件,創(chuàng)建一個(gè)listeEntry.js,作為liste.vue的入口,用于webpack生成list.js頁面。

const { router } = require("./router")
   const List = require("@/list.vue")
   
   /* eslint-disable no-new */
   new Vue(Vue.util.extend({el: "#root", router}, List))
   
   router.push("/")


修改webpack.common.conf.js文件

const weexEntry = {

 "index": helper.root("entry.js"),
 "list": helper.root("listEntry.js"),
}

webConfig的入口和出口配置(web)

1.在configs/webpack.common.conf.js下修改getEntryFile()函數(shù)

    const getEntryFile = () => {
    
      const entryFile = path.join(vueWebTemp, config.entryFilePath)
      const routerFile = path.join(vueWebTemp, config.routerFilePath)
      fs.outputFileSync(entryFile, getEntryFileContent(helper.root(config.entryFilePath), routerFile));
      fs.outputFileSync(routerFile, getRouterFileContent(helper.root(config.routerFilePath)));
    
      const listFilePath = "listEntry.js"
      const listFile = path.join(vueWebTemp, listFilePath)
      fs.outputFileSync(listFile, getEntryFileContent(helper.root(listFilePath), routerFile));
     
      return {
        index: entryFile,
        list: listFile,
      }
    }

2.在.temp文件下創(chuàng)建listEntry.js的webConfig入口文件。

        const { router } = require("./router")
        const List = require("@/list.vue")
        
        /* eslint-disable no-new */
        new Vue(Vue.util.extend({el: "#root", router}, List))
        
        router.push("/")
5.頁面

Weex僅有Flexbox布局,text無法嵌套,難以實(shí)現(xiàn)長(zhǎng)文當(dāng)中樣式的混合。
沒有Cookies.只能用storage來完成對(duì)應(yīng)信息的存儲(chǔ)。

二、weex與原生交互

擴(kuò)展:https://weex.apache.org/zh/gu...

const vvModule = weex.requireModule("VVWeexModule");    

vvModule.setGlobalCallback( res => {
    this.info = res;
    console.log(JSON.stringify(res));
        
});
vvModule.logInNative("aaa");


三、常用命令

Weex Toolkit:https://weex.apache.org/zh/to...

npm run server:web 端的預(yù)覽

npm run dev :實(shí)時(shí)的壓縮編譯

$ weex compile [資源文件] [產(chǎn)物地址] :編譯

$ weex preview [file | folder] :編譯及預(yù)覽

$ weex debug :調(diào)試

四、參考

weex開發(fā)小記:https://blog.csdn.net/mht1829...

https://www.jianshu.com/p/ae1...

使用 Devtools調(diào)試 Weex頁面 https://www.cnblogs.com/hehey...

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/105746.html

相關(guān)文章

  • weex初探

    摘要:解決在文件中,多頁面配置默認(rèn)是單頁面效果,首先,真正運(yùn)行的是,通過作為入口文件文件,通過,將文件打包成進(jìn)行使用。多頁面的重點(diǎn),就是將獨(dú)立頁面的文件,生成多個(gè)文件。的入口和出口配置參考文件,創(chuàng)建一個(gè),作為的入口,用于生成頁面。 前言 RN weex hippy taro 1.Weex與RN 比較 showImg(https://segmentfault.com/img/bVbvfFL?w...

    Cruise_Chan 評(píng)論0 收藏0
  • RN 技術(shù)探索:Hermes Engine 初探

    摘要:原方式中是經(jīng)過壓縮的腳本文件,預(yù)編譯后則是二進(jìn)制文件。兩者影響疊加導(dǎo)致整體減小,包大小得到優(yōu)化。引擎包引擎包官方文檔中對(duì)內(nèi)存區(qū)的描述您的應(yīng)用用于處理代碼和資源如字節(jié)碼已優(yōu)化或已編譯的碼庫和字體的內(nèi)存。本文首發(fā)自普惠出行產(chǎn)品技術(shù) 自從 Google 的 Flutter 發(fā)布之后,F(xiàn)acebook 對(duì) React-Native 的迭代開始快了起來,優(yōu)化 React-Native 的性能表現(xiàn)...

    Cc_2011 評(píng)論0 收藏0
  • 2017-08-31 前端日?qǐng)?bào)

    摘要:前端日?qǐng)?bào)精選從化的探討體會(huì)團(tuán)隊(duì)設(shè)計(jì)思想導(dǎo)致的跨站漏洞在餓了么前端的實(shí)踐還是你應(yīng)該選擇哪一個(gè)前端框架上手這篇就夠了中文網(wǎng)格布局入門上最流行的項(xiàng)目眾成翻譯的入門教程眾成翻譯開發(fā),在中配置眾成翻譯組件間的樣式污染掘金核心模塊之 2017-08-31 前端日?qǐng)?bào) 精選 從 setState promise 化的探討 體會(huì) React 團(tuán)隊(duì)設(shè)計(jì)思想jQuery導(dǎo)致的XSS跨站漏洞Weex 在餓了么...

    liuhh 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<