openai/netlify-frameworks
plugins/netlify/skills/netlify-frameworks/SKILL.md
Guide for deploying web frameworks on Netlify. Use when setting up a framework project (Vite/React, Astro, TanStack Start, Next.js, Nuxt, SvelteKit, Remix) for Netlify deployment, configuring adapters or plugins, or troubleshooting framework-specific Netlify integration. Covers what Netlify needs from each framework and how adapters handle server-side rendering.
$ install --global
skillsauthnpx skillsauth add openai/plugins netlify-frameworksInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: May 6, 2026, 6:05 AM175.9s7 files scanned
SKILL.md
- name:
- netlify-frameworks
- description:
- Guide for deploying web frameworks on Netlify. Use when setting up a framework project (Vite/React, Astro, TanStack Start, Next.js, Nuxt, SvelteKit, Remix) for Netlify deployment, configuring adapters or plugins, or troubleshooting framework-specific Netlify integration. Covers what Netlify needs from each framework and how adapters handle server-side rendering.
Frameworks on Netlify
Netlify supports any framework that produces static output. For frameworks with server-side capabilities (SSR, API routes, middleware), an adapter or plugin translates the framework's server-side code into Netlify Functions and Edge Functions automatically.
How It Works
During build, the framework adapter writes files to .netlify/v1/ — functions, edge functions, redirects, and configuration. Netlify reads these to deploy the site. You do not need to write Netlify Functions manually when using a framework adapter for server-side features.
Detecting Your Framework
Check these files to determine the framework:
| File | Framework |
|---|---|
| astro.config.* | Astro |
| next.config.* | Next.js |
| nuxt.config.* | Nuxt |
| vite.config.* + react-router | Vite + React (SPA or Remix) |
| app.config.* + @tanstack/react-start | TanStack Start |
| svelte.config.* | SvelteKit |
Framework Reference Guides
Each framework has specific adapter/plugin requirements and local dev patterns:
- Vite + React (SPA or with server routes): See references/vite.md
- Astro: See references/astro.md
- TanStack Start: See references/tanstack.md
- Next.js: See references/nextjs.md
General Patterns
Client-Side Routing (SPA)
For single-page apps with client-side routing, add a catch-all redirect:
# netlify.toml
[[redirects]]
from = "/*"
to = "/index.html"
status = 200
Custom 404 Pages
- Static sites: Create a
404.htmlin your publish directory. Netlify serves it automatically for unmatched routes. - SSR frameworks: Handle 404s in the framework's routing (the adapter maps this to Netlify's function routing).
Environment Variables in Frameworks
Each framework exposes environment variables to client-side code differently:
| Framework | Client prefix | Access pattern |
|---|---|---|
| Vite / React | VITE_ | import.meta.env.VITE_VAR |
| Astro | PUBLIC_ | import.meta.env.PUBLIC_VAR |
| Next.js | NEXT_PUBLIC_ | process.env.NEXT_PUBLIC_VAR |
| Nuxt | NUXT_PUBLIC_ | useRuntimeConfig().public.var |
Server-side code in all frameworks can access variables via process.env.VAR or Netlify.env.get("VAR").
Bundled References (Load As Needed)
- Vite + React guide
- Astro guide
- TanStack Start guide
- Next.js guide
Related Skills
openai/omniverse-usd-performance-tuning
tools
VerifiedTrustedCommunity
Top-level workflow skill for USD performance diagnosis and optimization. Use for slow loading, high memory, low FPS, or 'optimize my scene' requests; delegates auth/runtime setup to Phase 0 owners.
1,407SKILL.mdUpdated Jun 5, 2026
openai/magicpath
data-ai
VerifiedTrustedCommunity
Use when the user mentions MagicPath, designs, UI components, themes, canvas selections, or repo-to-canvas UI work; run magicpath-ai to search, inspect, install, or author components.
1,407SKILL.mdUpdated Jun 5, 2026
openai/omniverse-realtime-viewer
documentation
VerifiedTrustedCommunity
Use as the top-level router for Omniverse Realtime Viewer USD app requests and focused viewer reference documents.
1,407SKILL.mdUpdated Jun 4, 2026
openai/notion-spec-to-implementation
tools
VerifiedTrustedCommunity
Turn Notion specs into implementation plans, tasks, and progress tracking; use when implementing PRDs/feature specs and creating Notion plans + tasks from them.
1,407SKILL.mdUpdated May 6, 2026