Add Reanimated v2 to Expo (#9879)## HOW ### How to update reanimated 2 First, I've updated `UpdateVendoredModule.ts` files. The script was not flexible enough for reanimated V2 because we use c
Add Reanimated v2 to Expo (#9879)## HOW ### How to update reanimated 2 First, I've updated `UpdateVendoredModule.ts` files. The script was not flexible enough for reanimated V2 because we use cpp and mm files. To make it more flexible I've added `ModuleModifier` property which is just a function that's executed right after repo cloning. Additionally, I've added more extensions to the pattern in `findObjcFilesAsync`. ReanimatedModifier (ModuleModifier for Reanimated) performs the following steps: 1 replaceHermesByJSC(); 2 replaceJNIPackages(); 3 copyCPP(); 4 prepareIOSNativeFiles(); AD2 Reanimated is moved to versioned package so we have to change JNI paths. (Cpp uses java packages to find proper java class) AD4 finds all cpp and mm files and copies them to reanimated directory. (regardless of the depth in the source path). ### Android unversioned run (how it works) I've merged reanimated build.gradle with expoview one. I tried to include the first one to the second one but it just didn't work. I can fix it in separate pull-request (There was not enough time because the release of sdk 39 has already started and it's important for me to add reanimated before the end of it). The expoview `build.gradle` contains the code that builds reanimated SO and places it under `expoview/src/main/JNILibs`. It will run only once after the update of reanimated. The native part of the reanimated is plugged into two places. The first one is `VersionedUtils.java` and the second one is 'Kernel.java'. It's done by setting `JSIModulesPackage`. ### Android versioning Reanimated versioning is very similar to the versioning of react-native. To make it work I've done the following things: changed code that renames JNI in react-native in such a way that it also renames JNI in reanimated. added `prepare reanimated` step that prepares SO file which is compatible with versioned react-native. (only unversioned reanimated is build in Gradle task versioned one only uses already prepared SO that's created during versioning process) ### iOS unversioned Most logic that's necessary for TurboModules (which are used by Reanimated V2) has been added by Staszek so this pull-request only plugs Reanimated TurboModule in `EXVersionManager.mm` file. ### IOS versioning All obj-c and obj-c++ objects in reanimated2 contain `REA` prefix just like reanimated1. I had to add another sed command that works when REA is in the beginning of the line. All cpp objects are within `reanimated` namespace so I used a similar mechanism to the one that's used for `facebook` namespace. ## Testing et uvm -m react-native-reanimated OK et add-sdk -p ios -s 39.0.0. OK et add-sdk -p android -s 39.0.0. OK Ran Reanimted example in sandbox {iOS, android}x{unversioned, 39.0.0} Reanimated example: ```js import Animated, { useSharedValue, withTiming, useAnimatedStyle, Easing, } from 'react-native-reanimated'; import {View, Button} from 'react-native'; import React from 'react'; export default function AnimatedStyleUpdateExample(props) { const randomWidth = useSharedValue(10); const config = { duration: 500, easing: Easing.bezier(0.5, 0.01, 0, 1), }; const style = useAnimatedStyle(() => { return { width: withTiming(randomWidth.value, config), }; }); return ( <View style={{ flex: 1, flexDirection: 'column', }}> <Animated.View style={[ {width: 100, height: 80, backgroundColor: 'black', margin: 30}, style, ]} /> <Button title="toggle" onPress={() => { randomWidth.value = Math.random() * 350; }} /> </View> ); } ```
show more ...
[vscode] Add Rewrap for line-wrapping comments to recommended extensionsOption-Q is very useful for this
[vscode] Add shared VS Code settings (to use TypeScript from npm)This adds the VS Code settings file, which means that everyone developing in this repository with VS Code will use the same settings
[vscode] Add shared VS Code settings (to use TypeScript from npm)This adds the VS Code settings file, which means that everyone developing in this repository with VS Code will use the same settings, overlaid on top of their personal global settings. This ensures we can set things like line widths, spaces, and what version of TS to use in a consistent way.This commit tells VS Code to use TypeScript from the workspace root instead of whatever the TypeScript plugin has installed. This is so that TS messages in the editor match `tsc`'s messages from the CLI.
Add recommended VS Code extensionsRecommend plugins for ESLint and Prettier: https://code.visualstudio.com/docs/editor/extension-gallery#_workspace-recommended-extensionsfbshipit-source-id: a9d9d
Add recommended VS Code extensionsRecommend plugins for ESLint and Prettier: https://code.visualstudio.com/docs/editor/extension-gallery#_workspace-recommended-extensionsfbshipit-source-id: a9d9dc3