摘要:解決在文件中,多頁面配置默認是單頁面效果,首先,真正運行的是,通過作為入口文件文件,通過,將文件打包成進行使用。多頁面的重點,就是將獨立頁面的文件,生成多個文件。的入口和出口配置參考文件,創建一個,作為的入口,用于生成頁面。
前言
RN weex hippy taro
1.Weex與RN 比較類型 | React Native | Weex | |
思想 | learn once, write anywhere | write once, run anywhere | |
擴展 | 不同平臺可自由擴展 | 為了保證各平臺的一致性,一次擴展得在各個平臺都實現 | |
組件豐富程度 | 除了自帶的,還有js.coach上社區貢獻的,還是比較豐富的 | 基本只有自帶的10余種 | |
調式 | 有專門的調試工具,chrome調試,較為完善 | 暫時log調試 | |
性能 | 較好 | 較弱 | |
上手難度 | 稍高 | 容易 | |
核心理念 | React | Vue | |
框架程度 | 較重 | 較輕 | |
特點 | 適合開發整體App | 適合單頁面 | |
社區 | 豐富,Facebook維護 | 略殘念,目前托管apache | |
支持 | Android、IOS | Android、IOS、Web | |
適應性 | 原生開學習成本低 | Web開發學習成本低 | |
JS引擎 | JSCore | V8 |
IMWeb Conf2018 前端大會: Weex內核的原理和演進方向:
https://www.codercto.com/a/32...
http://www.itdks.com/Course/d...
Weex 在餓了么前端的實踐
https://www.jianshu.com/p/e14...
以下針對于iOS,編譯和運行時報錯處理:
添加特定平臺的項目
weex platform add ios
安裝cocopods
$ sudo gem install cocoapods
終端cd到ios項目,運行pod install 或者pod update
安裝好后在執行
$ weex run ios
錯誤:
./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 doctor3.調試
運行 weex debug 命令啟動調試控制臺,必須使用chrome 瀏覽器調試
4.編譯報錯運行npm run dev,出現eslint報錯。
解決:在config.js文件中,useEslint: false,
https://blog.csdn.net/u012182...
Weex默認是單頁面效果,首先,Weex真正運行的是,通過entry.js作為入口文件文件,通過webpack,將.vue文件打包成index.js進行使用。多頁面的重點,就是將獨立頁面的.vue文件,生成多個js文件。
weexConfig的入口和出口配置(iOS/Android):
參考entry.js文件,創建一個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()函數
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文件下創建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無法嵌套,難以實現長文當中樣式的混合。
沒有Cookies.只能用storage來完成對應信息的存儲。
擴展: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 端的預覽
npm run dev :實時的壓縮編譯
$ weex compile [資源文件] [產物地址]
$ weex preview [file | folder]
$ weex debug
weex開發小記:https://blog.csdn.net/mht1829...
https://www.jianshu.com/p/ae1...
使用 Devtools調試 Weex頁面 https://www.cnblogs.com/hehey...
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/54206.html
摘要:解決在文件中,多頁面配置默認是單頁面效果,首先,真正運行的是,通過作為入口文件文件,通過,將文件打包成進行使用。多頁面的重點,就是將獨立頁面的文件,生成多個文件。的入口和出口配置參考文件,創建一個,作為的入口,用于生成頁面。 前言 RN weex hippy taro 1.Weex與RN 比較 showImg(https://segmentfault.com/img/bVbvfFL?w...
摘要:原方式中是經過壓縮的腳本文件,預編譯后則是二進制文件。兩者影響疊加導致整體減小,包大小得到優化。引擎包引擎包官方文檔中對內存區的描述您的應用用于處理代碼和資源如字節碼已優化或已編譯的碼庫和字體的內存。本文首發自普惠出行產品技術 自從 Google 的 Flutter 發布之后,Facebook 對 React-Native 的迭代開始快了起來,優化 React-Native 的性能表現...
摘要:前端日報精選從化的探討體會團隊設計思想導致的跨站漏洞在餓了么前端的實踐還是你應該選擇哪一個前端框架上手這篇就夠了中文網格布局入門上最流行的項目眾成翻譯的入門教程眾成翻譯開發,在中配置眾成翻譯組件間的樣式污染掘金核心模塊之 2017-08-31 前端日報 精選 從 setState promise 化的探討 體會 React 團隊設計思想jQuery導致的XSS跨站漏洞Weex 在餓了么...
閱讀 1148·2021-09-22 15:43
閱讀 2345·2021-09-22 15:32
閱讀 4455·2021-09-22 15:11
閱讀 2188·2019-08-30 15:55
閱讀 2564·2019-08-30 15:54
閱讀 984·2019-08-30 15:44
閱讀 1095·2019-08-29 13:26
閱讀 794·2019-08-29 12:54