Expo大作戰(九)--expo的工作原理,以及版本發行說明

来源:https://www.cnblogs.com/gdsblog/archive/2018/03/11/8544444.html
-Advertisement-
Play Games

簡要:本系列文章講會對expo進行全面的介紹,本人從2017年6月份接觸expo以來,對expo的研究斷斷續續,一路走來將近10個月,廢話不多說,接下來你看到內容,將全部來與官網 我猜去全部機翻+個人修改補充+demo測試的形式,對expo進行一次大補血!歡迎加入expo興趣學習交流群:597732 ...


簡要:本系列文章講會對expo進行全面的介紹,本人從2017年6月份接觸expo以來,對expo的研究斷斷續續,一路走來將近10個月,廢話不多說,接下來你看到內容,將全部來與官網

我猜去全部機翻+個人修改補充+demo測試的形式,對expo進行一次大補血!歡迎加入expo興趣學習交流群:597732981

【之前我寫過一些列關於expo和rn入門配置的東i西,大家可以點擊這裡查看:從零學習rn開發

相關文章:

Expo大作戰(一)--什麼是expo,如何安裝expo clinet和xde,xde如何使用

Expo大作戰(二)--expo的生命周期,expo社區交流方式,expo學習必備資源,開發使用expo時關註的一些問題

Expo大作戰(三)--針對已經開發過react native項目開發人員有針對性的介紹了expo,expo的局限性,開發時項目選型註意點等

Expo大作戰(四)--快速用expo構建一個app,expo中的關鍵術語

Expo大作戰(五)--expo中app.json 文件的配置信息

Expo大作戰(六)--expo開發模式,expo中exp命令行工具,expo中如何查看日誌log,expo中的調試方式

Expo大作戰(七)--expo如何使用Genymotion模擬器

Expo大作戰(八)--expo中的publish以及expo中的link,對link這塊東西沒有詳細看,大家可以來和我交流

更多>>

接下來就開始擼碼


Expo&“Create React Native App”


Create Native React Native 應用程式可讓您構建React Native應用程式而無需任何構建配置。這聽起來可能很熟悉,因為expo也這樣做 - 當你用XDE或exp創建項目時,你不必處理Xcode或Android Studio配置文件,它就可以工作。本指南旨在概述Expo和CRNA(create-react-native-app)之間的一些主要差異。

CRNA不要求你有expo賬戶


你可以運行create-react-native-app  xx(app 名稱)。那麼,沒有賬戶意味著什麼,註冊和使用XDE / EXP會得到什麼?為什麼我們需要與expo一起?有一個expo賬戶可以讓你做到以下幾點:

將您的項目發佈到永久URL,例如:https://expo.io/@community/reactconf2017。有關更多信息,請參閱在Expo上發佈

為app / play商店分發構建二進位文件。要使用CRNA而不使用Expo,您需要運行彈出。

你可以在CRNA項目中使用XDE / exp嗎?

當然可以!像使用XDE和exp的其他expo項目一樣打開項目,它將按預期工作。

使用ExpoKit對CRNA用戶意味著什麼?

如果你想添加自定義本地代碼到你的expo應用程式,你將需要使用ExpoKit。使用CRNA,您有兩種選擇:您可以彈出(eject )一個普通的React Native項目,而不需要任何對Expo的依賴,或者您可以彈出(eject )使用ExpoKit,這將允許您繼續使用Expo API。點擊此處閱讀更多關於使用CRNA彈出的信息

 

Expo 如何運作


儘管沒有必要知道使用expo的這些情況,但許多工程師喜歡瞭解他們的工具如何工作。 我們將在這裡介紹幾個關鍵概念,其中包括:

  • 您的應用的本地開發(Local development of your app)
  • 發佈/部署您的應用的生產版本(Publishing/deploying a production version of your app)
  • Expo如何管理SDK的變化(How Expo manages changes to its SDK)
  • 離線打開Expo應用程(Opening Expo apps offline)

您還可以瀏覽源文件,分支文件,入侵併在github / @ expo上參與expo工具

本地運行項目(Serving an Expo project for local development)


這裡有兩個部分:Expo應用程式和Expo開發工具(XDE或者是CLI)。 為了簡化命名,我們將在這裡假設XDE。 當您在XDE中打開應用程式時,它會在後臺生成並管理兩個伺服器進程:Expo Development Server和React Native Packager Server。

註意:XDE還產生了一個隧道進程,它允許區域網外的設備在不需要更改防火牆設置的情況下訪問上述伺服器。 如果你想瞭解更多,請參閱ngrok

Expo開發伺服器 (Expo Development Server)

此伺服器是您在Expo App中輸入網址時首先點擊的端點。 其目的是為expo宣言提供服務,併在手機或模擬器上提供XDE用戶界面和expo應用程式之間的溝通層。

Expo清單 Expo Manifest


以下是通過XDE提供的清單示例。 你應該註意的第一件事是app.json有很多相同的欄位(如果你還沒有閱讀,請參閱配置與app.json部分)。 這些欄位直接從該文件中獲取 - expo應用程式訪問您的配置的方式。

{
  "name":"My New Project",
  "description":"A starter template",
  "slug":"my-new-project",
  "sdkVersion":"18.0.0",
  "version":"1.0.0",
  "orientation":"portrait",
  "primaryColor":"#cccccc",
  "icon":"https://s3.amazonaws.com/exp-brand-assets/ExponentEmptyManifest_192.png",
  "notification":{
    "icon":"https://s3.amazonaws.com/exp-us-standard/placeholder-push-icon.png",
    "color":"#000000"
  },
  "loading":{
    "icon":"https://s3.amazonaws.com/exp-brand-assets/ExponentEmptyManifest_192.png"
  },
  "entryPoint": "node_modules/expo/AppEntry.js",
  "packagerOpts":{
    "hostType":"tunnel",
    "dev":false,
    "strict":false,
    "minify":false,
    "urlType":"exp",
    "urlRandomness":"2v-w3z",
    "lanType":"ip"
  },
  "xde":true,
  "developer":{
    "tool":"xde"
  },
  "bundleUrl":"http://packager.2v-w3z.notbrent.internal.exp.direct:80/apps/new-project-template/main.bundle?platform=ios&dev=false&strict=false&minify=false&hot=false&includeAssetFileHashes=true",
  "debuggerHost":"packager.2v-w3z.notbrent.internal.exp.direct:80",
  "mainModuleName":"main",
  "logUrl":"http://2v-w3z.notbrent.internal.exp.direct:80/logs"
}

清單中的每個欄位都是一些配置選項,告訴expo運行您的應用程式需要知道什麼。應用程式首先獲取清單並使用它顯示您在app.json中指定的應用程式的載入圖標,然後繼續在給定的bundleUrl中獲取應用程式的JavaScript - 此URL指向React Native Packager Server。

為了將日誌流式傳輸到XDE,Expo SDK攔截對console.log,console.warn等的調用並將它們發佈到清單中指定的logUrl。該端點位於Expo Development Server上。

React Native Packager Server

如果您在沒有Expo的情況下使用React Native,您可以通過在項目目錄中運行react-native start來啟動打包程式。expo為您啟動,並將管道輸送到XDE。該伺服器有兩個目的。

首先是將您的應用程式JavaScript編譯為單個文件並翻譯您編寫的與您的手機的JavaScript引擎不相容的任何JavaScript代碼。例如,JSX不是有效的JavaScript--它是一種語言擴展,它使得React組件更加愉快,並且它被編譯成普通的函數調用 - 比如<HelloWorld />將成為React.createElement(HelloWorld,{},null) 有關更多信息,請參見深入JSX)。其他語言功能(如async / await)在大多數引擎中尚不可用,因此需要將它們編譯成可在您的手機的JavaScript引擎JavaScriptCore上運行的JavaScript代碼。

第二個目的是服務資產(serve assets)。當您在應用中添加圖片時,除非您已經緩存了該資源,否則您將在XDE中看到請求,您將使用類似<Image source = {require('./ assets / example.png')} />的語法日誌如:<START> processing asset request my-proejct/assets/[email protected]。註意它為屏幕DPI提供了正確的資產,假設它存在。

在生產環境中發佈/部署Expo應用程式

當您發佈Expo應用程式時,我們將其編譯為啟用了生產標誌的JavaScript包。也就是說,我們縮小了源代碼,並且我們告訴React Native包裝程式以生產模式構建(這又將__DEV__設置為false)。編譯完成後,我們將該捆綁包以及它需要的任何資產(請參閱資產)上傳到CloudFront。我們還將您的Manifest(包括大部分app.json配置)上傳到我們的伺服器。發佈完成後,我們會為您提供應用的網址,您可以將其發送給任何擁有expo客戶端人進行項目預覽體驗等。

註意:預設情況下,所有expo項目都是不公開的,這意味著發佈的項目不會在任何地方公開搜索或發現。分享鏈接取決於你。您可以在app.json中更改此設置。

發佈完成後,您的代碼的新版本即可供所有現有用戶使用。他們會在下次打開應用或刷新它時下載更新版本,前提是他們有一個支持在app.json中指定的sdkVersion的Expo客戶端版本。

iOS和Android上的更新處理方式不同。在Android上,更新在後臺下載。這意味著用戶第一次在更新後打開您的應用程式時,它們將獲得舊版本,而新版本將在後臺下載。他們第二次打開應用程式,他們將獲得新版本。在iOS上,更新是同步下載的,因此用戶在更新後第一次打開您的應用時將獲得新版本。

註意:要將應用程式打包到Apple App Store或Google Play商店進行部署,請參閱構建獨立應用程式。每次更新SDK版本時,都需要重新構建二進位文件。

SDK版本


expo應用程式的sdkVersion指出要使用哪個版本的ObjC / Java / C 層。每個sdkVersion大致對應於React Native和這些文檔的SDK部分中的expo圖書館的發行版。

Expo客戶端應用程式支持許多版本的Expo SDK,但應用程式一次只能使用一個。這使您可以立即發佈您的應用程式,並且即使我們完全修改或刪除了您的應用程式依賴的新版本的API,仍然可以在一年之內無任何更改地運行它。這是可能的,因為你的應用程式將始終與發佈它的日期相同的編譯代碼運行。

如果您使用新的sdkVersion向您的應用發佈更新,如果用戶尚未更新到最新的Expo客戶端,那麼他們仍然可以使用以前的sdkVersion。

註意:最終我們可能會制定一項政策,要求我們保留sdkVersions多久,並開始修剪客戶端的舊版本的sdk,但在我們這樣做之前,所有內容都將保持向後相容。

Opening a deployed Expo app


這個過程與開發expo用程式的過程基本相同,只是現在我們擊中了expo伺服器以獲取清單(only now we hit an Expo server to get the manifest),並且向我們展示了CloudFront檢索應用程式的JavaScript的過程。

離線開啟Expo App (Opening Expo Apps Offline)


expo客戶端會自動緩存已打開的每個應用程式的最新版本。 當您嘗試打開expo應用程式時,它總是嘗試並獲取最新版本,但如果因任何原因(包括完全離線)而失敗,則會載入最新的緩存版本。

如果您使用Expo構建獨立應用程式,那麼該獨立二進位文件還將附帶JavaScript的“預緩存”版本,以便它可以在沒有互聯網的情況下第一次冷啟動。 繼續閱讀以獲取有關獨立應用程式的更多信息。

獨立應用程式 (Standalone Apps)


您還可以將您的expo應用打包為獨立的二進位文件,以便提交至Apple iTunes Store或Google Play。

在引擎蓋下(Under the hood,),它是expo客戶端的修改版本,僅用於載入單個URL(適用於您的應用),並且永遠不會顯示expo主屏幕或品牌。 有關更多信息,請參閱構建獨立應用程式。

 

升級Expo Upgrading Expo


在發佈新版expo時,不一定要更新您的應用程式。 Expo客戶端的新版本與向以前版本發佈的應用程式向後相容。這意味著您可以下載expo客戶端的新版本並打開以前版本發佈的應用程式,並且它們將完美工作。

也就是說,每個版本都比上一個更好,所以您可能希望保持最新狀態以利用新功能和性能改進。

升級指南取決於sdkVersion,因此請按照發行說明中的​​指南進行操作

我們將發行說明發佈到expo,例如v25.0.0發行說明。如果您要升級多個主要版本,我們建議您按照當前版本和目標版本之間的每個主要版本的升級指南。

如果您在本地項目中運行ExpoKit,升級需要額外的步驟。 ExpoKit目前是一個alpha功能,升級難度會因版本不同而有所不同,但這裡有一些信息

歷史發行版本發行說明


下一張繼續介紹,這一篇主要介紹了:expo的工作原理,已經版本發行說明 歡迎大家關註我的微信公眾號,這篇文章是否被大家認可,我的衡量標準就是公

眾號粉絲增長人數。歡迎大家轉載,但必須保留本人博客鏈接!

我想文章翻譯到這裡,就告一段落,下麵的翻譯將會進行一些小組件小知識點的組合,我本人也會做一些小demo來體驗expo的有點的,謝謝大家關註!

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 簡要:本系列文章講會對expo進行全面的介紹,本人從2017年6月份接觸expo以來,對expo的研究斷斷續續,一路走來將近10個月,廢話不多說,接下來你看到內容,講全部來與官網 我猜去全部機翻+個人修改補充+demo測試的形式,對expo進行一次大補血!歡迎加入expo興趣學習交流群:597732 ...
  • 【展示效果說明】 對 app 操作錄屏時,展示出手指在 app 上的觸摸效果可以看到具體點擊,感覺這樣比較方便,也不用做視頻後期了。 這裡簡單用 runtime 實現了一個這樣的效果,不需要修改任何代碼,只要將 UIWindow+Touch.m 分類導入工程即可。 展示效果如下: 【實現思路】 1. ...
  • 異常: java.lang.RuntimeException: Parcelable encountered IOException writing serializable object 這是在intent發送數據的時候出現的,原因:通過intent傳遞的類實現了serialzable介面,但是那 ...
  • 恢復內容開始 打開monitor時出現 打開log一看,媽的,全是報錯日誌 真是聞者傷心,見者落淚。 隨便摘錄一篇日誌: 那麼長???!!!沒法看了,直接上網搜索。 第一種方法:據說是從外網stackoverflow流傳過來的秘方:只要用管理員身份打開就可以解決了。 實踐之後:完全不頂用啊!!! 第 ...
  • 最近在項目中需要做自動定位功能,就是你在參加會議通過掃描二維碼簽到的時候自動定位並將你的定位信息在簽到中上傳,這樣可以避免我們進行假簽到。在這個功能中,主要用到的是系統自帶的定位模塊,首先我們是需要配置定位功能的參數,然後當我們定位成功時調用特定的方法進行相應操作就可以了,當然,在定位失敗時我們也可 ...
  • 使用的自定義類,如下: 動態變數控制 動態添加方法 動態交換兩個方法的實現 攔截並替換方法 在方法上增加額外功能 對runtime進行歸納總結,代碼如下: 1、載入運行時頭文件: 2、具體實現代碼: ...
  • 簡要:本系列文章講會對expo進行全面的介紹,本人從2017年6月份接觸expo以來,對expo的研究斷斷續續,一路走來將近10個月,廢話不多說,接下來你看到內容,講全部來與官網 我猜去全部機翻+個人修改補充+demo測試的形式,對expo進行一次大補血!歡迎加入expo興趣學習交流群:597732 ...
  • 簡要:本系列文章講會對expo進行全面的介紹,本人從2017年6月份接觸expo以來,對expo的研究斷斷續續,一路走來將近10個月,廢話不多說,接下來你看到內容,講全部來與官網 我猜去全部機翻+個人修改補充+demo測試的形式,對expo進行一次大補血!歡迎加入expo興趣學習交流群:597732 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...