Skip to content

Commit 0136f95

Browse files
committed
chore: migration guide update
1 parent 4f137ce commit 0136f95

1 file changed

Lines changed: 15 additions & 20 deletions

File tree

docs/docs/guides/01-getting-started.mdx

Lines changed: 15 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -11,23 +11,10 @@ import Tabs from '@theme/Tabs';
1111

1212
Open a Terminal in your project's folder and install the library:
1313

14-
<Tabs groupId="expo-vs-cli">
15-
<TabItem value="expo" label="Expo" default>
16-
17-
```bash
18-
npx expo install react-native-paper
19-
```
20-
21-
</TabItem>
22-
<TabItem value="community-cli" label="Community CLI">
23-
2414
```bash npm2yarn
2515
npm install react-native-paper
2616
```
2717

28-
</TabItem>
29-
</Tabs>
30-
3118
React Native Paper uses [react-native-safe-area-context](https://github.com/th3rdwave/react-native-safe-area-context) for handling safe area, [react-native-reanimated](https://docs.swmansion.com/react-native-reanimated/) and [react-native-worklets](https://docs.swmansion.com/react-native-worklets/) for animations.
3219

3320
<Tabs groupId="expo-vs-cli">
@@ -37,24 +24,31 @@ React Native Paper uses [react-native-safe-area-context](https://github.com/th3r
3724
npx expo install react-native-safe-area-context react-native-reanimated react-native-worklets
3825
```
3926

27+
Minimum requirements:
28+
29+
- `react-native-reanimated` **≥ 4.3.0**
30+
- `react-native-worklets` **≥ 0.8.1**
31+
- `react-native-safe-area-context` — version compatible with your React Native toolchain.
32+
33+
Follow the [React Native Reanimated installation guide](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started/).
34+
35+
If you use Expo, you don't need to install vector icons - those are the part of the expo package. However, if you have a `babel.config.js` or `.babelrc` file, make sure that it includes `babel-preset-expo`.
36+
4037
</TabItem>
4138
<TabItem value="community-cli" label="Community CLI">
4239

4340
```bash npm2yarn
4441
npm install react-native-safe-area-context react-native-reanimated react-native-worklets
4542
```
4643

47-
</TabItem>
48-
</Tabs>
49-
50-
Follow the [React Native Reanimated installation guide](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started/).
51-
5244
Minimum requirements:
5345

5446
- `react-native-reanimated` **≥ 4.3.0**
5547
- `react-native-worklets` **≥ 0.8.1**
5648
- `react-native-safe-area-context` — version compatible with your React Native toolchain.
5749

50+
Follow the [React Native Reanimated installation guide](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started/).
51+
5852
If you're on a vanilla React Native project, you also need to install and link [@react-native-vector-icons/material-design-icons](https://github.com/oblador/react-native-vector-icons).
5953

6054
Specifically `MaterialDesignIcons` icon pack needs to be included in the project, because some components use those internally (e.g. `AppBar.BackAction` on Android).
@@ -67,12 +61,13 @@ npm install @react-native-vector-icons/material-design-icons
6761
The `react-native-vector-icons` library requires some additional setup steps for each platform. To ensure proper use of icon fonts, please follow their [installation guide](https://github.com/oblador/react-native-vector-icons?tab=readme-ov-file#setup).
6862
:::
6963

70-
If you use Expo, you don't need to install vector icons - those are the part of the expo package. However, if you have a `babel.config.js` or `.babelrc` file, make sure that it includes `babel-preset-expo`.
71-
7264
:::info
7365
If you don't want to install vector icons, you can use [babel-plugin-optional-require](https://github.com/satya164/babel-plugin-optional-require) to opt-out.
7466
:::
7567

68+
</TabItem>
69+
</Tabs>
70+
7671
### Bundle size optimization
7772

7873
To get smaller bundle size by excluding modules you don't use, you can use our optional babel plugin. The plugin automatically rewrites the import statements so that only the modules you use are imported instead of the whole library. Add `react-native-paper/babel` to the `plugins` section in your `babel.config.js` for production environment. It should look like this:

0 commit comments

Comments
 (0)