> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/millionco/react-doctor/llms.txt
> Use this file to discover all available pages before exploring further.
# React Native Rules
> React Native and Expo platform-specific best practices
These 8 rules are automatically enabled when React Doctor detects a React Native or Expo project. They catch platform-specific issues and enforce mobile best practices.
## Rules
**Severity:** error\
**Rule ID:** `react-doctor/rn-no-raw-text`
Requires text to be wrapped in `` components. Raw text outside `` crashes on React Native.
**Why it crashes:**
React Native doesn't support raw text nodes like web React. All text must be in `` components.
**Bad:**
```tsx theme={null}
Hello world
{userName}
{123}
```
**Good:**
```tsx theme={null}
Hello world
{userName}
{123}
```
This rule is automatically disabled in files with the `'use dom'` directive for React Native's DOM components.
**Severity:** error\
**Rule ID:** `react-doctor/rn-no-deprecated-modules`
Detects removed React Native modules and suggests community alternatives.
**Deprecated modules:**
* `AsyncStorage` → `@react-native-async-storage/async-storage`
* `Picker` → `@react-native-picker/picker`
* `DatePickerIOS` → `@react-native-community/datetimepicker`
* `SafeAreaView` → `react-native-safe-area-context`
* `WebView` → `react-native-webview`
* `NetInfo` → `@react-native-community/netinfo`
* `Clipboard` → `@react-native-clipboard/clipboard`
**Bad:**
```tsx theme={null}
import { AsyncStorage, WebView } from 'react-native';
```
**Good:**
```tsx theme={null}
import AsyncStorage from '@react-native-async-storage/async-storage';
import { WebView } from 'react-native-webview';
```
**Severity:** warn\
**Rule ID:** `react-doctor/rn-no-legacy-expo-packages`
Detects deprecated Expo packages and suggests modern alternatives.
**Deprecated packages:**
* `expo-av` → `expo-audio` and `expo-video`
* `expo-permissions` → Module-specific permission APIs
* `@expo/vector-icons` → `expo-image` with SF Symbols
**Bad:**
```tsx theme={null}
import { Audio } from 'expo-av';
import * as Permissions from 'expo-permissions';
```
**Good:**
```tsx theme={null}
import { Audio } from 'expo-audio';
import { Camera } from 'expo-camera';
// Request permissions from module
await Camera.requestCameraPermissionsAsync();
```
**Severity:** warn\
**Rule ID:** `react-doctor/rn-no-dimensions-get`
Prevents using `Dimensions.get()` which doesn't update on screen rotation. Use `useWindowDimensions()` for reactive layouts.
**Why it's bad:**
* `Dimensions.get()` returns static values
* Doesn't update on device rotation
* Requires manual event listeners
* `addEventListener` was removed in RN 0.72
**Bad:**
```tsx theme={null}
const { width, height } = Dimensions.get('window');
// This was removed!
Dimensions.addEventListener('change', callback);
```
**Good:**
```tsx theme={null}
import { useWindowDimensions } from 'react-native';
function Component() {
const { width, height } = useWindowDimensions();
// Automatically updates on rotation
}
```
**Severity:** warn\
**Rule ID:** `react-doctor/rn-no-inline-flatlist-renderitem`
Prevents inline `renderItem` functions on list components. Inline functions create new references every render, breaking list optimization.
**Why it's bad:**
* New function reference every render
* Prevents PureComponent optimization
* List items re-render unnecessarily
* Poor scroll performance
**Bad:**
```tsx theme={null}