Cline + Expo
In-app feedback for Expo, fixed by Cline
You are building an Expo or React Native app with Cline. Cline lives in a panel inside VS Code and asks before it acts, so you watch each step. Its MCP settings are one JSON file that you open from the panel.
1. Paste one prompt into Cline
Open your project in VS Code, open the Cline panel, and paste the prompt into its chat.
Add Nitpick feedback to this app. Fetch https://nitpickhq.com/install.md and follow every step.Cline follows install.md. nitpick login opens your browser, where you create an account and start the subscription, and Cline waits for that before it adds the component.
The model marks each command as safe or as needing approval. Under Auto Approve you choose whether Cline runs only the commands marked safe, or all commands, without asking, and a separate setting covers MCP servers.
2. What lands in your Expo code
Roughly this. Cline writes it, you review it.
- Install the packages with Expo's installer so the versions match your SDK, then add the Nitpick package.
- Wrap the root layout in NitpickProvider with your public app key.
- Wrap buttons, fields and cards in NitpickElement and give each a name.
npx expo install react-native-view-shot expo-device expo-constants
npm install @nitpickhq/react-nativeimport { Stack, usePathname } from "expo-router";
import { NitpickProvider, NitpickElement, useNitpickScreen } from "@nitpickhq/react-native";
function ScreenName() {
useNitpickScreen(usePathname());
return null;
}
export default function RootLayout() {
return (
<NitpickProvider appKey="npk_YOUR_PUBLIC_KEY">
<ScreenName />
<Stack />
</NitpickProvider>
);
}
// Name what users may point at
<NitpickElement name="Home/StartButton">
<Pressable onPress={start}><Text>Start</Text></Pressable>
</NitpickElement>Works in Expo Go. With Expo Router, render a small ScreenName component inside the provider that calls useNitpickScreen(usePathname()). Details in Install for Expo and React Native.
3. Give Cline the MCP server
Cline keeps MCP servers in a settings file that you open from its own panel: the MCP Servers icon, then the Configure tab, then Configure MCP Servers.
{
"mcpServers": {
"nitpick": {
"command": "npx",
"args": ["-y", "@nitpickhq/cli", "mcp"],
"disabled": false,
"autoApprove": []
}
}
}Leave autoApprove empty until you have seen what the tools do. You can allow single tools later, such as list_feedback.
Open the MCP Servers icon again. The nitpick entry should be listed there and enabled.
4. Start the dev server with Cline
npx expo start runs the dev server that Expo Go connects to. The run commands build the native app locally and need Xcode or Android Studio.
npx expo start
# or build the native app locally
npx expo run:ios
npx expo run:androidInstalls and the dev server start appear as commands in the Cline panel. Approve them one by one at first, then decide whether to let Cline run safe commands on its own.
5. Let Cline fix the reports
In the Cline chat, ask it to use the Nitpick MCP tools: list open feedback, fix each report and mark it resolved. It calls list_feedback, reads each report with its screenshot through get_feedback, and finds the code. An element name such as checkout.pay-button leads to the NitpickElement that has that name, and a screen name is the route path, if you pass usePathname() to useNitpickScreen. When the fix is done it calls resolve_feedback.
Working with Cline
- Auto Approve is checked for each tool call, so you can allow reading files but still approve every command.
- YOLO mode approves everything, including MCP tools. Leave it off while you are still learning what the Nitpick tools do.
- Cline also has a command line interface. This page covers the panel in VS Code.
Good to know for Expo
- A ScrollView shows only its visible part in the screenshot, and video, maps and web views can come out empty. Nothing is masked automatically, so wrap sensitive parts in NitpickMask.
- This was tested in Expo Go on iOS. A React Native app without Expo modules has not been tested, so this page does not promise it works there.
$9 a month per account. Unlimited apps.
Get startedRelated
- Cline with SwiftUI
- Claude Code with Expo
- Codex with Expo
- Cursor with Expo
- Add in-app feedback to an Expo app
- In-app feedback with a screenshot in Expo
- Collect bug reports from users in Expo
- MCP reference