Skip to content

Commit

Permalink
Add docs for expo managed workflows (#308)
Browse files Browse the repository at this point in the history
  • Loading branch information
andreazllin authored Nov 15, 2024
1 parent 6cfbf2c commit e243f07
Showing 1 changed file with 27 additions and 0 deletions.
27 changes: 27 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,10 @@ If you use the `automatic` JSX transformation, set the library to be the import
}]
```

### React Native

#### Bare workflow

Unfortunately, the `metro-react-native-babel-preset` that comes with react-native out of the box does not allow you to change the options of the `babel/plugin-transform-react-jsx` plugin. Just add the plugin with options as listed below and start react-native packager as usual. Default env for babel is "development". If you do not use expo when working with react-native, the following method will help you.

```js
Expand All @@ -53,6 +57,27 @@ module.exports = {
}
```

#### Expo managed

You can pass params to `@babel/preset-react` through `babel-preset-expo`

```js
// babel.config.js
module.exports = function (api) {
api.cache(true);
return {
presets: [
[
"babel-preset-expo",
{
jsxImportSource: "@welldone-software/why-did-you-render",
},
],
],
};
};
```

> Notice: Create React App (CRA) ^4 **does use the `automatic` JSX transformation.**
> [See the following comment on how to do this step with CRA](https://github.com/welldone-software/why-did-you-render/issues/154#issuecomment-773905769)
Expand Down Expand Up @@ -112,6 +137,8 @@ Also, tracking custom hooks is possible by using `trackExtraHooks`. For example
```jsx
import React from 'react';

// For react-native you might want to use
// the __DEV__ flag instead of process.env.NODE_ENV === 'development'
if (process.env.NODE_ENV === 'development') {
const whyDidYouRender = require('@welldone-software/why-did-you-render');
const ReactRedux = require('react-redux');
Expand Down

0 comments on commit e243f07

Please sign in to comment.