check-rsc-compat

Audit Stitches RSC components for React Server Components compatibility issues.

2|Updated Jan 27, 2026

Search Tags:#compatibility #audit #static-analysis #rsc #react-server-components #stitches #css-extraction

Ready to run

npx skills add https://github.com/artmsilva/stitches-rsc --skill check-rsc-compat

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: check-rsc-compat
Source: https://github.com/artmsilva/stitches-rsc/tree/main/.claude/plugins/stitches-rsc-dev/skills/check-rsc-compat
Command: npx skills add https://github.com/artmsilva/stitches-rsc --skill check-rsc-compat

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps developers verify that Stitches RSC components are compatible with React Server Components by detecting runtime CSS generation, client-side hooks usage, and unsafe browser patterns.

Core Features & Use Cases

Detects runtime CSS generation and incompatible client patterns before deployment.
Scans components across server and client boundaries to prevent runtime errors in server components.
Provides guidance on fixes and safe patterns for RSC readiness.

Quick Start

Run the quick compatibility check on a component file using the provided script to audit RSC patterns.

Frequently Asked Questions about check-rsc-compat

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I check React Server Components compatibility for Stitches components?▼

To check React Server Components compatibility, audit Stitches source code for runtime CSS generation, client-side state usage without 'use client', and forbidden browser APIs. This flags incompatible patterns across server and client boundaries to prevent runtime errors.

What makes a Stitches component incompatible with React Server Components?▼

A Stitches component is incompatible with React Server Components if it uses runtime CSS generation, direct browser APIs, non-serializable props, or client-side hooks without a 'use client' directive. These patterns break server boundaries and cause runtime errors.

How do I audit my codebase for unsafe RSC patterns before deployment?▼

Audit your codebase for unsafe RSC patterns by scanning single-file components or entire projects to detect client-side state usage and browser API calls. This verifies serializable props and flags incompatible patterns before deployment.

Does Stitches work with React Server Components across server and client boundaries?▼

Stitches works with React Server Components only if components avoid runtime CSS generation and direct browser APIs. You must add 'use client' directives for client-side state usage to ensure safe execution across server and client boundaries.

Why does my Stitches component fail in a React Server Component?▼

Your Stitches component fails in a React Server Component because it likely contains runtime CSS generation, direct browser APIs, or client-side state without a 'use client' directive. Scanning the source flags these incompatible patterns.

When do I need to verify RSC compatibility for my Stitches components?▼

Verify RSC compatibility for Stitches components before deployment to ensure serializable props and no forbidden browser APIs. This prevents runtime errors when rendering components across server and client boundaries.