Expoがv33にアップデートした。
今回は時間かかったからモリモリなモリな内容でたくさんあるよね的な。
hooksとかTypeScriptとかreact-native-webでweb対応とかカスタムExpo Clientのビルド云々とか。
Expo SDK v33.0.0 is now available
ということで今日は変更点的なお話をば。
ちなみにまだExpoのビルドサーバがv33対応していないからスタンドアローンビルドできないらしい。
注意文消えてるからもうできるっぽい
■ExpoでWeb対応
Built-in web support for Expo CLI and SDK, first announced in March, is now in full beta with SDK 33! This means Expo projects are now tri-platform.
We’ve heard from users who want to share code between web, iOS, and Android that it’s challenging to set up react-native-web in both new and existing projects. We wanted to make this easier, so web support now ships with Expo template projects starting with SDK 33, powered by react-native-web behind the scenes.
Many of our Expo SDK modules now include built-in web support; you can see the list of currently supported modules here. More information and examples of using web in Expo projects can be found in the expo/web-examples repo, along with guidance for contributing to the project.
We’re really excited to be bringing web support to all Expo projects! Please do note that the feature is still in beta, so while it may not build a production-ready website on day one, we hope it’ll provide a good starting point. We welcome your feedback and suggestions as you try it out!
3月にも発表したけどExpoでもWebを吐き出すことができるよ的な。
react-native-webを新しくプロジェクトに入れるとか面倒だろうから、SDK33では標準で入れておいたよ的な。
expo/web-examplesっていうリポジトリがサンプル集なのでチェックしてくれみたいな。
ただしベータ版だから注意してほしいんだけど、フィードバックとかそういうの求めてるからよろしくねみたいな。
■カスタムなiOSのExpo clientビルド
Expo CLI can now create a custom Expo client for your Apple Developer team, specifically for development and testing. It’s like building the Expo client from source yourself, but done for you by Expo’s build service. This customized version will include features that have been Android-only for more than a year now, including the QR code scanner, the Explore tab, and the ability to open other users’ projects. It also includes Background Location, which we recently had to remove from the App Store version of the Expo client (see the Restricted Background Location section below).
This workflow will use your Apple Developer account credentials and a feature called ad-hoc provisioning profiles, which allows you to install apps onto your phone from Safari. We’ve simplified this process as much as we can so that it’s easy to build your own customized Expo client. In the future, we hope to support further customizations that make the Expo client more similar to your production app, so that your development workflow can be even smoother.
You’ll need a paid Apple Developer account in order to build a custom Expo client with a new command: expo client:ios. See the docs for a detailed walkthrough of how to create a custom Expo client, and check out Quin Jung’s talk at App.js Conf to learn how it all works!
今までみたいな他人の作ったものでも走らせたいとかQRコードでアプリを読み取るみたいな機能を持ったカスタムExpo Clientをビルドできるようになったよ的な。
ちなみに後述するけどバックグラウンドロケーションもApp Storeのガイドライン的にはNGだからそれもこのカスタムクライアント内に入ってるからテストできるよ的な。
将来的にはスタンドアローンビルドと同じくらいいろんな機能をサポートするみたい。
さらにアドホックでの配信になるからテストフライトとかそういうのもいらないし、ブラウザ経由でカスタムクライアントを入れられる的な。
有料版のデベロッパーアカウントに登録して、expo client:iosコマンドを入力すると普通にビルドするような感じで色々と尋ねられるので入力してあとはビルドを待つだけ的な。
詳しい流れについてはこちらを見ればよい的な
というかカスタムっていうとなんか自分の独自機能を入れられるみたいなニュアンスに感じちゃうけど、実際はApp Storeのガチガチ制約で消さないといけなかった機能を搭載してるクライアントアプリ的な。
■優先プランとかサービス内容
We’re beginning to introduce paid services for developers using Expo, with a focus on better serving businesses that use our tools. As part of this first step, we’re introducing Teams and Priority Builds.
Teams let multiple developers publish the same Expo project, making it easier to collaborate at work.
Priority Builds coordinate our standalone build queues to give faster, more predictable build times for businesses and others who need it. This also eases contention for our finite set of builders, smoothing out peaks in the build queue so that traffic jams are less frequent and less gnarly for everyone.
The priority plan is not yet widely available, but we’re looking to open it up more broadly soon.
優先プランの導入を徐々に進めているよ的な。
チームで開発できるようになったりとか、優先的にスタンドアローンビルドできるようにしたりとか。
近いうちにオープンにするみたい。
■Bare workflow
Since we first announced the Bare workflow, we’ve made a number of incremental improvements to it. Installation of unimodules on Android is much easier now: just install the dependency through npm and rebuild your app, and it’ll be available. We’ve also added support for the use_frameworks! directive alongside unimodules. Finally, we’ve improved the documentation (such as explaining how to integrate with react-native-navigation) and fixed issues that early adopters encountered with a number of unimodule packages. We’re excited to see that the unimodules core package is already getting more than 5,000 downloads per week, and we look forward to seeing the ecosystem grow.
If you haven’t done so already, we recommend updating to the latest version of react-native-unimodules in your project (dig into the CHANGELOG for the nitty gritty details).
Our next target is to get to a point of feature parity with ExpoKit so that we can deprecate ExpoKit and move everyone to this more flexible architecture. At that point, we’ll switch expo eject over to the Bare workflow and provide a guide for migrating your project off ExpoKit.
素のreact-nativeプロジェクトでもExpoのAPIを使うためのBare workflowを公開して以来、いろんな人にreact-native-unimodulesを使ってもらっている的な。
特にAndroidでの導入はすごく簡単だよみたいな。
将来的にはExpoKitと同様の機能搭載して、ejectしたらreact-native-unimodulesがExpoKitの代わりに入るようにするみたい。
■モジュールをインポートする形に
With SDK 33, we’re deprecating imports of most modules from the expo package. This means that in a future release, you won’t be able to write, for example, import { FileSystem } from 'expo';. Rather, you’ll need to install the individual packages for each module you use and import from them instead.
You can use the new expo install command to install modules; this command is a wrapper around npm install/yarn add that automatically installs a module version compatible with your SDK version. For example, for the FileSystem module, you would run expo install expo-file-system and then use import * as FileSystem from 'expo-file-system';. This change paves the way for tree-shaking and smaller JavaScript bundles. It also makes moving between the managed and bare workflows simpler.
Imports from the expo package will continue to work in SDK 33 but will generate a warning in the console, and you’ll need to import from the individual packages to make the warning disappear. To make this change easier, we’re providing a codemod that’ll automatically update all of your imports for you.
SDK33から使用するモジュールを都度インポートする形に変更していくよ的な。
例えばFileSystemだったらimport { FileSystem } from "expo"ってやっていたけど、npm install expo-file-systemしてから import * as FileSystem from 'expo-file-system'として使用するみたいな。
こういう流れにすることによってJSのバンドルサイズを小さくしたりとか、Bare workflowに移行しやすくできるようにしたいとのこと。
とりあえずはコンソールで警告を出す形にするから、ちゃんとインポートしてくれよな的な。
ちなみにcodemodっていうパッケージを用意しておいたから、これを使えば簡単にできるようになるっていう。
■TypeScript
With SDK 33, all Expo-authored modules have been converted to TypeScript, and the types definitions (.d.ts files) are included with all of the Expo packages. These TypeScript definitions are generated from the original source code, meaning they reflect the source of truth.
Since the type definitions are included in the Expo packages, you can now omit @types/expo when using TypeScript in your project.
We’re also providing a new blank template for new projects, which includes App.tsx and tsconfig.json. This template is optional, and we still provide standard JavaScript templates; the new template just makes it easier to get started with TypeScript. To use this template, make sure you’ve installed the latest version of Expo CLI, then run expo init and choose the blank (TypeScript) template.
TypeScript対応するようになったよ的な。
全てTypeScriptで書き直したし型定義もあるしExpoパッケージ内に型定義あるから今度から@types/expoいらなくなるよっていう。
TabsテンプレートはjsだけどブランクテンプレートはTypeScriptバージョンも用意したからそちらを使ってね的な。
■React Hooks
With SDK 33 comes support for React 16.8.3, which includes hooks! If you’re unfamiliar with hooks, take a look at the React docs for a detailed explanation.
One example of a hook is the new useKeepAwake API in SDK 33:
function Example() {
useKeepAwake();
returnThe screen will stay awake. ;
}
ついにReact hooksが使えるようになったよ。
例えば今まで使ってたKeepAwakeはuseKeepAwake()っていうAPIを用意したからこれ使ってねみたいな。
■バックグラウンドロケーションの注意点
Unfortunately, we had to remove Background Location from the iOS Expo client in order to comply with the App Store guidelines. This means that if your app uses Background Location, you’ll need to use either a Custom iOS Expo client build (see above), your standalone app, or the Android Expo client, in order to test that functionality.
これはカスタムクライアント部分で説明してるから省略的な。
ざっくりいうとバックグラウンドロケーションをiOSのExpoクライアントに搭載するとストアに公開できなくなっちゃうから、iOSのExpoクライアントにはバックグラウンドロケーション入っていないよ的な。
■Dropping SDKs 26–30 from the Expo client
As usual, your standalone apps built with older SDKs will continue to work; additionally, expo build will support SDKs 27 and above. However, projects on SDKs 26-30 will no longer work within the latest version of Expo client. To continue developing your projects, you’ll need to upgrade to a newer version. We highly recommend upgrading to SDK 33 now in order to front-load most of the work required for creating 64-bit Android APKs, which will be required to submit new builds to Google Play beginning in August.
ここはいつも通りな流れだからほぼほぼ省略。
けど8月からGoogle Play Storeには64bit APKをアップデートしないといけなくなるし、64bitビルドはSDK34からだからSDK33というか最新版にしておいた方がいいよ的な。
そうすればスムーズにSDK34にも移行できるよ。
■Optimize your images with Expo CLI
You can now compress your images easily and quickly using Expo CLI! This saves your users bandwidth and makes your app bundle size smaller. (Read more about this in our detailed update.)
これは以前にもブログ上で告知されたやつ。
Expo CLI使って画像とかのサイズ縮小とかできるよっていうやつ。
詳しくはこちら
■APIの改善だったり新しいの
新しいAPI
Four new APIs have been added with SDK 33. Crypto and Random provide methods to generate and work with cryptographically secure strings, and they can be used as primitives to build fully-featured crypto libraries in JavaScript. Sharing provides a method to share media and files to different applications on the device. Finally, VideoThumbnails allows generating an image thumbnail from a video file.
・CryptoとRandom
暗号化された安全な文字列を生成して処理するためのメソッドを提供するから、jsで暗号化ライブラリを構築することができる様になるよ的な。
・Sharing
他のアプリとかに画像とかファイルを受け渡しできるよ。
・VideoThumbnails
動画から画像のサムネイルを生成できるよ。
HapticsとバックグラウントフェッチのAndroid対応
The Haptics and BackgroundFetch modules, which were previously iOS only, are now available on Android as well.
AndroidでもHaptics(振動)とかバックグラウンドフェッチが使える様になったよ。
改良したモジュール
The Haptics and BackgroundFetch modules, which were previously iOS only, are now available on Android as well.
AndroidでもHaptics(振動)とかバックグラウンドフェッチが使える様になったよ。
React Native 0.59
React Native 0.59になったよ。
Other fixes & improvements
See the CHANGELOG for the full list of changes in SDK 33.
他にも色々と変更したからCHANGELOG 見てね的な。
破壊的変更
We’ve corrected behavior of splash screen image based on resizeMode in Android standalone apps. The behavior that was previously called cover is now properly called contain and vice versa. You may need to switch this setting in your app.json.
We’ve removed the deprecated MediaView and TriggerView imports from expo-ads-facebook. You’ll need to switch to AdMediaView and AdTriggerView instead.
We renamed the Haptic module to Haptics and added missing Async suffixes to all of the method names.
Similarly, we renamed IntentLauncherAndroid to IntentLauncher and changed the signature of the startActivityAsync method to add more configuration options.
Finally, on Android the promise returned by WebBrowser.openBrowserAsync is resolved on opening Custom Tabs instead of on closing.
Ejected projects
We added the UMAppDelegateWrapper class to @unimodules/core which allows easy integration between unimodules and AppDelegate callbacks.
We’ve removed all use of the expolib_v1 prefixed libraries (okhttp and okio) from ExpoKit in favor of regular versions to improve compatibility of third-party libraries.
Finally, we removed the devKernel and prodKernel build flavors from Android ExpoKit projects. This means that with SDK 33, all gradle commands are simplified to [verb](Debug|Release), e.g. installDebug or assembleRelease.
AndroidのスタンドアローンでのスプラッシュスクリーンのresizeModeの挙動が変わったよ。
facebookのAd関連変更したよ。
HapticをHapticsに命名変更したよ。
IntentLauncherAndroidをIntentLauncherに命名変更して、startActivityAsync()のシグネチャを変更してオプションを追加した的な。
AndroidでのWebBrowser.openBrowserAsync()が返すPromiseは、カスタムタブを開くことでresolveされるようになったよ。
Ejectedについてはほぼほぼ影響無しだろうから省略。
■Upgrading Your App
あとはいつも通りアップグレードしちゃえばいい的な。
いつも通りかなり省略してざっくりとまとめちゃったけどこんな感じ。
大きいところとしてはReact Native 0.59.8対応でhooksが使えたり、TypeScript化だったり、react-native-webの標準対応だったり、App Storeのガチガチ制約によってExpoクライアントに色々と制限食らってるからそれを解決するためにアドホックで色んな機能搭載したExpoクライアントダウンロードできるようにしたり。
人によってはreact-native-webがやっぱ大きそうだよね。
個人的にはモジュールインポート形式に変更になったからバンドルサイズが下げられるのが地味に大きかったり、react-native-unimodulesに今度からは力入れていくよっていうのがすごくよい。
v34ではアプリ内課金を搭載する予定っていうし下手したらほぼほぼの機能をExpoで賄えるんじゃないかっていうね。
SwiftUIとか巷では話題だけどもそれ以上に便利な感じだからまだまだReact NativeというかExpo使っていきたい的なみたいな感じ。
0 件のコメント:
コメントを投稿