Frontend · Cursor
React Native & Expo Router .cursorignore
A .cursorignore for React Native & Expo Router that keeps build output, large files and secrets out of Cursor's index (best effort).
- Path
- .cursorignore
- Loads
- Indexing and AI features
- Format
- gitignore syntax
- Used by
- Cursor
What this file tells the agent
This .cursorignore keeps React Native & Expo Router build output, large data files and environment secrets out of Cursor's index and AI features, so context goes to your source code. It is best effort: commands the agent runs in the terminal can still read ignored files, so keep real secrets out of the repo too.
- Use Expo Router file-based filesystem routing (app/_layout.tsx, app/(tabs)/index.tsx); ban legacy React Navigation container boilerplate.
- Enforce react-native-safe-area-context (useSafeAreaInsets or SafeAreaView) for all top-level mobile screen boundaries.
- Use modern Expo SDK native modules (expo-image, expo-secure-store, expo-crypto) instead of unmaintained bare native packages.
- Optimize for React Native New Architecture (Fabric renderer): avoid synchronous layout measurements in render passes.
- Always test cross-platform styling on both iOS and Android (e.g. elevation vs shadowColor, notch handling).
Code to avoid, and what to write instead
The rule steers the agent away from the left and toward the right.
// Discouraged: Missing safe-area insets, slow standard Image component, obsolete navigation prop
export default function BadProfile({ navigation }: any) {
return (
<div style={{ marginTop: 50 }}>
<img src="avatar.png" />
<button onClick={() => navigation.navigate("Home")}>Go</button>
</div>
);
}import { View, Text, StyleSheet } from "react-native";
import { Image } from "expo-image";
import { useSafeAreaInsets } from "react-native-safe-area-context";
export default function ProfileScreen() {
const insets = useSafeAreaInsets();
return (
<View style={[styles.container, { paddingTop: insets.top, paddingBottom: insets.bottom }]}>
<Image
source={{ uri: "https://example.com/avatar.png" }}
style={styles.avatar}
contentFit="cover"
transition={200}
/>
<Text style={styles.title}>User Profile</Text>
</View>
);
}
const styles = StyleSheet.create({
container: { flex: 1, backgroundColor: "#fff", paddingHorizontal: 16 },
avatar: { width: 80, height: 80, borderRadius: 40 },
title: { fontSize: 20, fontWeight: "600", marginTop: 12 },
});Install it in one command
- 01
Go to your project root
The file goes at .cursorignore, relative to the root.
- 02
Download the file
Run the command on the right. It downloads this preset and writes the file.
- 03
Make sure it gets used
Cursor applies .cursorignore automatically. Matching files leave the index and AI features, but commands the agent runs in the terminal can still read them.
$ curl -fsSL "https://www.devscratchpad.tech/api/raw/cursorignore/react-native-expo" -o ".cursorignore"
writes .cursorignore
.cursorignore
To write the file from your own code instead, use Read your code or Convert Legacy Rules in the editor above.
More for React Native & Expo Router
Questions
- How is .cursorignore different from .gitignore?
- .gitignore decides what git tracks. .cursorignore keeps files out of Cursor's codebase index and AI features; Cursor already skips files in .gitignore when it indexes.
- Does .cursorignore reduce wasted context?
- Yes. Ignored files are not indexed or pulled into requests, so build output and large data files do not crowd out your source code.