From e0dd56c38af293ec85fbc391253c0364b327bd0e Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Tue, 2 Aug 2022 14:56:53 +0200 Subject: [PATCH 01/12] Update plugin error message --- Example/babel.config.js | 1 + Example/package.json | 2 +- Example/yarn.lock | 20 ++++++++++---------- docs/docs/fundamentals/installation.md | 21 ++++++++++++++++++++- docs/docs/fundamentals/web-support.md | 17 +++++++++++++++++ package.json | 1 - plugin.js | 11 ----------- src/index.ts | 3 ++- src/index.web.ts | 5 +++++ src/reanimated2/core.ts | 16 ++++++++-------- yarn.lock | 13 ------------- 11 files changed, 64 insertions(+), 46 deletions(-) create mode 100644 src/index.web.ts diff --git a/Example/babel.config.js b/Example/babel.config.js index c89f9199ce6..aefd75d9f6f 100644 --- a/Example/babel.config.js +++ b/Example/babel.config.js @@ -7,6 +7,7 @@ module.exports = (api) => { 'module:metro-react-native-babel-preset', ], plugins: [ + '@babel/plugin-proposal-export-namespace-from', '@babel/plugin-proposal-optional-chaining', '@babel/plugin-transform-modules-commonjs', '../plugin', diff --git a/Example/package.json b/Example/package.json index 5b0dccb1838..a2b4dadf0bf 100644 --- a/Example/package.json +++ b/Example/package.json @@ -22,7 +22,7 @@ "pod-install": "cd ios && pod install && cd .." }, "dependencies": { - "@babel/plugin-proposal-export-namespace-from": "^7.17.12", + "@babel/plugin-proposal-export-namespace-from": "^7.18.9", "@fortawesome/fontawesome-svg-core": "^1.2.28", "@fortawesome/free-solid-svg-icons": "^5.13.0", "@fortawesome/react-native-fontawesome": "^0.2.3", diff --git a/Example/yarn.lock b/Example/yarn.lock index ab29a84b0e3..bbd0ed4bdf0 100644 --- a/Example/yarn.lock +++ b/Example/yarn.lock @@ -909,16 +909,16 @@ resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz#aa3a8ab4c3cceff8e65eb9e73d87dc4ff320b2f5" integrity sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA== -"@babel/helper-plugin-utils@^7.17.12": - version "7.17.12" - resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.17.12.tgz#86c2347da5acbf5583ba0a10aed4c9bf9da9cf96" - integrity sha512-JDkf04mqtN3y4iAbO1hv9U2ARpPyPL1zqyWs/2WG1pgSq9llHFjStX5jdxb84himgJm+8Ng+x0oiWF/nw/XQKA== - "@babel/helper-plugin-utils@^7.18.6": version "7.18.6" resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.18.6.tgz#9448974dd4fb1d80fefe72e8a0af37809cd30d6d" integrity sha512-gvZnm1YAAxh13eJdkb9EWHBnF3eAub3XTLCZEehHT2kWxiKVRL64+ae5Y6Ivne0mVHmMYKT+xWgZO+gQhuLUBg== +"@babel/helper-plugin-utils@^7.18.9": + version "7.18.9" + resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.18.9.tgz#4b8aea3b069d8cb8a72cdfe28ddf5ceca695ef2f" + integrity sha512-aBXPT3bmtLryXaoJLyYPXPlSD4p1ld9aYeR+sJNOZjJJGiOpb+fKfh3NkcCu7J54nUJwCERPBExCCpyCOHnu/w== + "@babel/helper-plugin-utils@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.8.3.tgz#9ea293be19babc0f52ff8ca88b34c3611b208670" @@ -1467,12 +1467,12 @@ "@babel/helper-plugin-utils" "^7.13.0" "@babel/plugin-syntax-export-namespace-from" "^7.8.3" -"@babel/plugin-proposal-export-namespace-from@^7.17.12": - version "7.17.12" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-export-namespace-from-7.17.12.tgz#b22864ccd662db9606edb2287ea5fd1709f05378" - integrity sha512-j7Ye5EWdwoXOpRmo5QmRyHPsDIe6+u70ZYZrd7uz+ebPYFKfRcLcNu3Ro0vOlJ5zuv8rU7xa+GttNiRzX56snQ== +"@babel/plugin-proposal-export-namespace-from@^7.18.9": + version "7.18.9" + resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-export-namespace-from-7.18.9.tgz#5f7313ab348cdb19d590145f9247540e94761203" + integrity sha512-k1NtHyOMvlDDFeb9G5PhUXuGj8m/wiwojgQVEhJ/fsVsMCpLyOP4h0uGEjYJKrRI+EVPlb5Jk+Gt9P97lOGwtA== dependencies: - "@babel/helper-plugin-utils" "^7.17.12" + "@babel/helper-plugin-utils" "^7.18.9" "@babel/plugin-syntax-export-namespace-from" "^7.8.3" "@babel/plugin-proposal-json-strings@^7.12.13", "@babel/plugin-proposal-json-strings@^7.14.2": diff --git a/docs/docs/fundamentals/installation.md b/docs/docs/fundamentals/installation.md index 3a224120b65..3f2ad2a759d 100644 --- a/docs/docs/fundamentals/installation.md +++ b/docs/docs/fundamentals/installation.md @@ -31,7 +31,7 @@ Add Reanimated's babel plugin to your `babel.config.js`: By default, Reanimated plugin generate source location using absolute path. You can configure to use relative path: -```js {5} +```js {7} module.exports = { ... plugins: [ @@ -80,6 +80,25 @@ If you're using Proguard, make sure to add rules preventing it from optimizing T As reanimated is setup to configure and install automatically, the only thing you have to do is to run `pod install` in the `ios/` directory. Note that the auto-installation setup works for the standard React Native apps, if you have problems setting it up with a custom setup (e.g. brownfield) please start a new issue where we can find a way to guide you through that process. +## Web + +You need to add [`@babel/plugin-proposal-export-namespace-from`](https://babeljs.io/docs/en/babel-plugin-proposal-export-namespace-from) babel plugin. + +```bash +yarn add @babel/plugin-proposal-export-namespace-from +``` + +```js {5} + module.exports = { + ... + plugins: [ + ... + '@babel/plugin-proposal-export-namespace-from', + 'react-native-reanimated/plugin', + ], + }; +``` + ## Sample React-Native project configured with Reanimated If you have troubles configuring Reanimated in your project, or just want to try the library without the need of setting it up on a fresh project we recommend checking our [Reanimated Playground](https://github.com/software-mansion-labs/reanimated-2-playground) repo, which is essentially a fresh React-Native app with Reanimated library installed and configured properly. diff --git a/docs/docs/fundamentals/web-support.md b/docs/docs/fundamentals/web-support.md index 8e3b63164d7..7379eaf9223 100644 --- a/docs/docs/fundamentals/web-support.md +++ b/docs/docs/fundamentals/web-support.md @@ -8,6 +8,23 @@ Since [2.0.0-alpha.7](https://github.com/software-mansion/react-native-reanimated/releases/tag/2.0.0-alpha.7) release it's possible to launch reanimated 2 in a web browser. For that case all of the functionalities are implemented purely in javascript, hence the efficiency of the animations might drop. +Reanimated for web require following configuration steps. You need to add [`@babel/plugin-proposal-export-namespace-from`](https://babeljs.io/docs/en/babel-plugin-proposal-export-namespace-from) and Reaniamted babel plugin to your `babel.config.js`. + +```bash +yarn add @babel/plugin-proposal-export-namespace-from +``` + +```js {5,6} +module.exports = { + ... + plugins: [ + ... + '@babel/plugin-proposal-export-namespace-from', + 'react-native-reanimated/plugin', + ], +}; +``` + If you use [playground](https://github.com/software-mansion-labs/reanimated-2-playground) and want to start the app in the browser, just type: diff --git a/package.json b/package.json index 2f9f9c7d29c..1c75013f74b 100644 --- a/package.json +++ b/package.json @@ -71,7 +71,6 @@ }, "homepage": "https://github.com/software-mansion/react-native-reanimated#readme", "dependencies": { - "@babel/plugin-proposal-export-namespace-from": "^7.17.12", "@babel/plugin-transform-object-assign": "^7.16.7", "@babel/preset-typescript": "^7.16.7", "@types/invariant": "^2.2.35", diff --git a/plugin.js b/plugin.js index 5dcf92a57ae..9873ac0c6d3 100644 --- a/plugin.js +++ b/plugin.js @@ -761,16 +761,6 @@ function isPossibleOptimization(fun) { return flags; } -const pluginProposalExportNamespaceFrom = - require('@babel/plugin-proposal-export-namespace-from').default; -const apiMock = { - assertVersion: () => { - // do nothing. - }, -}; -const ExportNamedDeclarationFn = - pluginProposalExportNamespaceFrom(apiMock).visitor.ExportNamedDeclaration; - module.exports = function ({ types: t }) { return { pre() { @@ -793,7 +783,6 @@ module.exports = function ({ types: t }) { processIfGestureHandlerEventCallbackFunctionNode(t, path, state); }, }, - ExportNamedDeclaration: ExportNamedDeclarationFn, }, }; }; diff --git a/src/index.ts b/src/index.ts index ad5c7e228d7..87e9b0d8276 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,6 @@ // tree-shaken side effects import './reanimated2/js-reanimated/global'; +import * as Animated from './Animated'; export * from './reanimated2'; -export * as default from './Animated'; +export default Animated; diff --git a/src/index.web.ts b/src/index.web.ts new file mode 100644 index 00000000000..4d6922d656e --- /dev/null +++ b/src/index.web.ts @@ -0,0 +1,5 @@ +// tree-shaken side effects +import './reanimated2/js-reanimated/global'; + +export * from './reanimated2'; +export * as default from './Animated'; // Failed to initialize react-native-reanimated library, make sure you followed installation steps here: https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation/ 1) Make sure reanimated's babel plugin is installed in your babel.config.js (you should have 'react-native-reanimated/plugin' listed there - also see the above link for details) 2) Make sure you reset build cache after updating the config, run: yarn start --reset-cache diff --git a/src/reanimated2/core.ts b/src/reanimated2/core.ts index 1bcfe26af52..4fdfa80fa11 100644 --- a/src/reanimated2/core.ts +++ b/src/reanimated2/core.ts @@ -41,14 +41,18 @@ const testWorklet: BasicWorkletFunction = () => { 'worklet'; }; +const throwUninitializedReanimatedException = () => { + throw new Error( + "Failed to initialize react-native-reanimated library, make sure you followed installation steps here: https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation/ \n1) Make sure reanimated's babel plugin is installed in your babel.config.js (you should have 'react-native-reanimated/plugin' listed there - also see the above link for details) \n2) Make sure you reset build cache after updating the config, run: yarn start --reset-cache" + ); +}; + export const checkPluginState: (throwError: boolean) => boolean = ( throwError = true ) => { if (!testWorklet.__workletHash && !shouldBeUseWeb()) { if (throwError) { - throw new Error( - "Reanimated 2 failed to create a worklet, maybe you forgot to add Reanimated's babel plugin?" - ); + throwUninitializedReanimatedException(); } return false; } @@ -62,11 +66,7 @@ export const isConfigured: (throwError?: boolean) => boolean = ( }; export const isConfiguredCheck: () => void = () => { - if (!isConfigured(true)) { - throw new Error( - 'If you want to use Reanimated 2 then go through our installation steps https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation' - ); - } + checkPluginState(true); }; function pushFrame(frame: (timestamp: Timestamp) => void): void { diff --git a/yarn.lock b/yarn.lock index baa7954e6cf..9fe30d73008 100644 --- a/yarn.lock +++ b/yarn.lock @@ -538,11 +538,6 @@ resolved "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz" integrity sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA== -"@babel/helper-plugin-utils@^7.17.12": - version "7.17.12" - resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.17.12.tgz#86c2347da5acbf5583ba0a10aed4c9bf9da9cf96" - integrity sha512-JDkf04mqtN3y4iAbO1hv9U2ARpPyPL1zqyWs/2WG1pgSq9llHFjStX5jdxb84himgJm+8Ng+x0oiWF/nw/XQKA== - "@babel/helper-plugin-utils@^7.18.6": version "7.18.6" resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.18.6.tgz#9448974dd4fb1d80fefe72e8a0af37809cd30d6d" @@ -928,14 +923,6 @@ "@babel/helper-plugin-utils" "^7.16.7" "@babel/plugin-syntax-export-namespace-from" "^7.8.3" -"@babel/plugin-proposal-export-namespace-from@^7.17.12": - version "7.17.12" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-export-namespace-from-7.17.12.tgz#b22864ccd662db9606edb2287ea5fd1709f05378" - integrity sha512-j7Ye5EWdwoXOpRmo5QmRyHPsDIe6+u70ZYZrd7uz+ebPYFKfRcLcNu3Ro0vOlJ5zuv8rU7xa+GttNiRzX56snQ== - dependencies: - "@babel/helper-plugin-utils" "^7.17.12" - "@babel/plugin-syntax-export-namespace-from" "^7.8.3" - "@babel/plugin-proposal-export-namespace-from@^7.18.6": version "7.18.6" resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-export-namespace-from-7.18.6.tgz#1016f0aa5ab383bbf8b3a85a2dcaedf6c8ee7491" From 8cafd735dbc2cd4f0aefc701e98eca6a906687d0 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Fri, 12 Aug 2022 22:34:07 +0200 Subject: [PATCH 02/12] Update docs/docs/fundamentals/installation.md Co-authored-by: Tomek Zawadzki --- docs/docs/fundamentals/installation.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/fundamentals/installation.md b/docs/docs/fundamentals/installation.md index 3f2ad2a759d..1f765b1c8fe 100644 --- a/docs/docs/fundamentals/installation.md +++ b/docs/docs/fundamentals/installation.md @@ -82,7 +82,7 @@ As reanimated is setup to configure and install automatically, the only thing yo ## Web -You need to add [`@babel/plugin-proposal-export-namespace-from`](https://babeljs.io/docs/en/babel-plugin-proposal-export-namespace-from) babel plugin. +You need to add [`@babel/plugin-proposal-export-namespace-from`](https://babeljs.io/docs/en/babel-plugin-proposal-export-namespace-from) Babel plugin. ```bash yarn add @babel/plugin-proposal-export-namespace-from From 3199a9df96514bb71831fe7612f16712f4d09ec6 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Fri, 12 Aug 2022 22:34:12 +0200 Subject: [PATCH 03/12] Update docs/docs/fundamentals/web-support.md Co-authored-by: Tomek Zawadzki --- docs/docs/fundamentals/web-support.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/fundamentals/web-support.md b/docs/docs/fundamentals/web-support.md index 743f3f518f4..e0562fa9453 100644 --- a/docs/docs/fundamentals/web-support.md +++ b/docs/docs/fundamentals/web-support.md @@ -8,7 +8,7 @@ Since the [2.0.0-alpha.7](https://github.com/software-mansion/react-native-reanimated/releases/tag/2.0.0-alpha.7) release it's possible to launch reanimated 2 in a web browser. For that case all of the functionalities are implemented purely in javascript, hence the efficiency of the animations might drop. -Reanimated for web require following configuration steps. You need to add [`@babel/plugin-proposal-export-namespace-from`](https://babeljs.io/docs/en/babel-plugin-proposal-export-namespace-from) and Reaniamted babel plugin to your `babel.config.js`. +Reanimated for Web requires the following configuration steps. You need to add [`@babel/plugin-proposal-export-namespace-from`](https://babeljs.io/docs/en/babel-plugin-proposal-export-namespace-from) as well as Reanimated Babel plugin to your `babel.config.js`. ```bash yarn add @babel/plugin-proposal-export-namespace-from From 05aea5366b516970b4656c24eaeef370bf780352 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Fri, 12 Aug 2022 22:35:26 +0200 Subject: [PATCH 04/12] Remove comment --- src/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/index.ts b/src/index.ts index bbaa7977305..e8eb32fb61b 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,4 +1,3 @@ -// tree-shaken side effects import * as Animated from './Animated'; import webGlobalIsInitialized from './reanimated2/js-reanimated/global'; if (!webGlobalIsInitialized) { From a5cb26a65d16ec8cc5d6008ae73787d6761362c6 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Fri, 12 Aug 2022 22:42:19 +0200 Subject: [PATCH 05/12] Update comment with exception message --- src/index.web.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.web.ts b/src/index.web.ts index 4d6922d656e..1ca39d94956 100644 --- a/src/index.web.ts +++ b/src/index.web.ts @@ -2,4 +2,4 @@ import './reanimated2/js-reanimated/global'; export * from './reanimated2'; -export * as default from './Animated'; // Failed to initialize react-native-reanimated library, make sure you followed installation steps here: https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation/ 1) Make sure reanimated's babel plugin is installed in your babel.config.js (you should have 'react-native-reanimated/plugin' listed there - also see the above link for details) 2) Make sure you reset build cache after updating the config, run: yarn start --reset-cache +export * as default from './Animated'; // If this line fails, you probably forgot some installation steps. Check out the installation guide here: https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/installation/ 1) Make sure reanimated's babel plugin is installed in your babel.config.js (you should have 'react-native-reanimated/plugin' listed there - also see the above link for details) 2) Make sure you reset build cache after updating the config, run: yarn start --reset-cache From 7ad7e711e94e72da4318367760c63095eefe0c66 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Fri, 12 Aug 2022 23:24:54 +0200 Subject: [PATCH 06/12] Add information about presset --- docs/docs/fundamentals/installation.md | 40 +++++++++++-------- .../version-2.0.x/installation.md | 12 +++--- .../version-2.1.x/installation.md | 12 +++--- .../version-2.2.x/installation.md | 12 +++--- .../fundamentals/installation.md | 12 +++--- .../fundamentals/installation.md | 12 +++--- 6 files changed, 58 insertions(+), 42 deletions(-) diff --git a/docs/docs/fundamentals/installation.md b/docs/docs/fundamentals/installation.md index 1f765b1c8fe..33a86a1b2b8 100644 --- a/docs/docs/fundamentals/installation.md +++ b/docs/docs/fundamentals/installation.md @@ -19,30 +19,34 @@ yarn add react-native-reanimated Add Reanimated's babel plugin to your `babel.config.js`: -```js {5} +```js {7} module.exports = { + presets: [ ... - plugins: [ - ... - 'react-native-reanimated/plugin', - ], + ], + plugins: [ + ... + 'react-native-reanimated/plugin', + ], }; ``` By default, Reanimated plugin generate source location using absolute path. You can configure to use relative path: -```js {7} +```js {9} module.exports = { + presets: [ ... - plugins: [ - ... - [ - 'react-native-reanimated/plugin', { - relativeSourceLocation: true, - }, - ] - ], - }; + ], + plugins: [ + ... + [ + 'react-native-reanimated/plugin', { + relativeSourceLocation: true, + }, + ] + ], +}; ``` :::caution @@ -88,9 +92,11 @@ You need to add [`@babel/plugin-proposal-export-namespace-from`](https://babeljs yarn add @babel/plugin-proposal-export-namespace-from ``` -```js {5} +```js {7} module.exports = { - ... + presets: [ + ... + ], plugins: [ ... '@babel/plugin-proposal-export-namespace-from', diff --git a/docs/versioned_docs/version-2.0.x/installation.md b/docs/versioned_docs/version-2.0.x/installation.md index 6b27bd47e4a..4666255403a 100644 --- a/docs/versioned_docs/version-2.0.x/installation.md +++ b/docs/versioned_docs/version-2.0.x/installation.md @@ -57,13 +57,15 @@ To use Reanimated 2 built from the main branch: Add Reanimated's babel plugin to your `babel.config.js`: -```js {5} +```js {7} module.exports = { + presets: [ ... - plugins: [ - ... - 'react-native-reanimated/plugin', - ], + ], + plugins: [ + ... + 'react-native-reanimated/plugin', + ], }; ``` diff --git a/docs/versioned_docs/version-2.1.x/installation.md b/docs/versioned_docs/version-2.1.x/installation.md index 6b27bd47e4a..4666255403a 100644 --- a/docs/versioned_docs/version-2.1.x/installation.md +++ b/docs/versioned_docs/version-2.1.x/installation.md @@ -57,13 +57,15 @@ To use Reanimated 2 built from the main branch: Add Reanimated's babel plugin to your `babel.config.js`: -```js {5} +```js {7} module.exports = { + presets: [ ... - plugins: [ - ... - 'react-native-reanimated/plugin', - ], + ], + plugins: [ + ... + 'react-native-reanimated/plugin', + ], }; ``` diff --git a/docs/versioned_docs/version-2.2.x/installation.md b/docs/versioned_docs/version-2.2.x/installation.md index 6b27bd47e4a..4666255403a 100644 --- a/docs/versioned_docs/version-2.2.x/installation.md +++ b/docs/versioned_docs/version-2.2.x/installation.md @@ -57,13 +57,15 @@ To use Reanimated 2 built from the main branch: Add Reanimated's babel plugin to your `babel.config.js`: -```js {5} +```js {7} module.exports = { + presets: [ ... - plugins: [ - ... - 'react-native-reanimated/plugin', - ], + ], + plugins: [ + ... + 'react-native-reanimated/plugin', + ], }; ``` diff --git a/docs/versioned_docs/version-2.3.x/fundamentals/installation.md b/docs/versioned_docs/version-2.3.x/fundamentals/installation.md index 41a2f8a35ba..edc034b4404 100644 --- a/docs/versioned_docs/version-2.3.x/fundamentals/installation.md +++ b/docs/versioned_docs/version-2.3.x/fundamentals/installation.md @@ -20,13 +20,15 @@ yarn add react-native-reanimated Add Reanimated's babel plugin to your `babel.config.js`: -```js {5} +```js {7} module.exports = { + presets: [ ... - plugins: [ - ... - 'react-native-reanimated/plugin', - ], + ], + plugins: [ + ... + 'react-native-reanimated/plugin', + ], }; ``` diff --git a/docs/versioned_docs/version-2.5.x/fundamentals/installation.md b/docs/versioned_docs/version-2.5.x/fundamentals/installation.md index 8312a43d386..c41c9f1fb3f 100644 --- a/docs/versioned_docs/version-2.5.x/fundamentals/installation.md +++ b/docs/versioned_docs/version-2.5.x/fundamentals/installation.md @@ -19,13 +19,15 @@ yarn add react-native-reanimated Add Reanimated's babel plugin to your `babel.config.js`: -```js {5} +```js {7} module.exports = { + presets: [ ... - plugins: [ - ... - 'react-native-reanimated/plugin', - ], + ], + plugins: [ + ... + 'react-native-reanimated/plugin', + ], }; ``` From d05bb93701e71bb2a558910985ab47e310a04a9e Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Tue, 16 Aug 2022 10:55:45 +0200 Subject: [PATCH 07/12] Update docs/versioned_docs/version-2.0.x/installation.md Co-authored-by: Tomek Zawadzki --- docs/versioned_docs/version-2.0.x/installation.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/versioned_docs/version-2.0.x/installation.md b/docs/versioned_docs/version-2.0.x/installation.md index 4666255403a..43249f4eee5 100644 --- a/docs/versioned_docs/version-2.0.x/installation.md +++ b/docs/versioned_docs/version-2.0.x/installation.md @@ -55,7 +55,7 @@ To use Reanimated 2 built from the main branch: ## Babel plugin -Add Reanimated's babel plugin to your `babel.config.js`: +Add Reanimated's Babel plugin to your `babel.config.js`: ```js {7} module.exports = { From d9a08f9d261450108147712d246d5620c7e5f80f Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Tue, 16 Aug 2022 10:55:54 +0200 Subject: [PATCH 08/12] Update docs/versioned_docs/version-2.5.x/fundamentals/installation.md Co-authored-by: Tomek Zawadzki --- docs/versioned_docs/version-2.5.x/fundamentals/installation.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/versioned_docs/version-2.5.x/fundamentals/installation.md b/docs/versioned_docs/version-2.5.x/fundamentals/installation.md index c41c9f1fb3f..4924e10ce81 100644 --- a/docs/versioned_docs/version-2.5.x/fundamentals/installation.md +++ b/docs/versioned_docs/version-2.5.x/fundamentals/installation.md @@ -17,7 +17,7 @@ yarn add react-native-reanimated ## Babel plugin -Add Reanimated's babel plugin to your `babel.config.js`: +Add Reanimated's Babel plugin to your `babel.config.js`: ```js {7} module.exports = { From 12a39bee8d0a9e96e428a3e616034cc8274fa365 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Tue, 16 Aug 2022 10:56:04 +0200 Subject: [PATCH 09/12] Update docs/versioned_docs/version-2.3.x/fundamentals/installation.md Co-authored-by: Tomek Zawadzki --- docs/versioned_docs/version-2.3.x/fundamentals/installation.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/versioned_docs/version-2.3.x/fundamentals/installation.md b/docs/versioned_docs/version-2.3.x/fundamentals/installation.md index edc034b4404..30d3cf53dd6 100644 --- a/docs/versioned_docs/version-2.3.x/fundamentals/installation.md +++ b/docs/versioned_docs/version-2.3.x/fundamentals/installation.md @@ -18,7 +18,7 @@ yarn add react-native-reanimated ## Babel plugin -Add Reanimated's babel plugin to your `babel.config.js`: +Add Reanimated's Babel plugin to your `babel.config.js`: ```js {7} module.exports = { From efe335ced6be9b610cb3e7dc71cfc165145dc89a Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Tue, 16 Aug 2022 10:57:29 +0200 Subject: [PATCH 10/12] Update docs/versioned_docs/version-2.2.x/installation.md Co-authored-by: Tomek Zawadzki --- docs/versioned_docs/version-2.2.x/installation.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/versioned_docs/version-2.2.x/installation.md b/docs/versioned_docs/version-2.2.x/installation.md index 4666255403a..43249f4eee5 100644 --- a/docs/versioned_docs/version-2.2.x/installation.md +++ b/docs/versioned_docs/version-2.2.x/installation.md @@ -55,7 +55,7 @@ To use Reanimated 2 built from the main branch: ## Babel plugin -Add Reanimated's babel plugin to your `babel.config.js`: +Add Reanimated's Babel plugin to your `babel.config.js`: ```js {7} module.exports = { From 919a3056dad927bb21b5a3c2c9e980eb9ed4a063 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Tue, 16 Aug 2022 10:57:35 +0200 Subject: [PATCH 11/12] Update docs/versioned_docs/version-2.1.x/installation.md Co-authored-by: Tomek Zawadzki --- docs/versioned_docs/version-2.1.x/installation.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/versioned_docs/version-2.1.x/installation.md b/docs/versioned_docs/version-2.1.x/installation.md index 4666255403a..43249f4eee5 100644 --- a/docs/versioned_docs/version-2.1.x/installation.md +++ b/docs/versioned_docs/version-2.1.x/installation.md @@ -55,7 +55,7 @@ To use Reanimated 2 built from the main branch: ## Babel plugin -Add Reanimated's babel plugin to your `babel.config.js`: +Add Reanimated's Babel plugin to your `babel.config.js`: ```js {7} module.exports = { From 100143f8b1aa3a0e6c3d2cb58359d678ad1a5d16 Mon Sep 17 00:00:00 2001 From: Krzysztof Piaskowy Date: Tue, 16 Aug 2022 10:59:32 +0200 Subject: [PATCH 12/12] Added presets to web --- docs/docs/fundamentals/web-support.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/docs/fundamentals/web-support.md b/docs/docs/fundamentals/web-support.md index e0562fa9453..f5c44f7c9bf 100644 --- a/docs/docs/fundamentals/web-support.md +++ b/docs/docs/fundamentals/web-support.md @@ -16,7 +16,9 @@ yarn add @babel/plugin-proposal-export-namespace-from ```js {5,6} module.exports = { - ... + presets: [ + ... + ], plugins: [ ... '@babel/plugin-proposal-export-namespace-from',