Skip to content

Commit e243f07

Browse files
authored
Add docs for expo managed workflows (#308)
1 parent 6cfbf2c commit e243f07

File tree

1 file changed

+27
-0
lines changed

1 file changed

+27
-0
lines changed

README.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,10 @@ If you use the `automatic` JSX transformation, set the library to be the import
3939
}]
4040
```
4141

42+
### React Native
43+
44+
#### Bare workflow
45+
4246
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.
4347

4448
```js
@@ -53,6 +57,27 @@ module.exports = {
5357
}
5458
```
5559

60+
#### Expo managed
61+
62+
You can pass params to `@babel/preset-react` through `babel-preset-expo`
63+
64+
```js
65+
// babel.config.js
66+
module.exports = function (api) {
67+
api.cache(true);
68+
return {
69+
presets: [
70+
[
71+
"babel-preset-expo",
72+
{
73+
jsxImportSource: "@welldone-software/why-did-you-render",
74+
},
75+
],
76+
],
77+
};
78+
};
79+
```
80+
5681
> Notice: Create React App (CRA) ^4 **does use the `automatic` JSX transformation.**
5782
> [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)
5883
@@ -112,6 +137,8 @@ Also, tracking custom hooks is possible by using `trackExtraHooks`. For example
112137
```jsx
113138
import React from 'react';
114139

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

0 commit comments

Comments
 (0)