stackblitz-common-errors
Fix WebContainer and StackBlitz errors: COOP/COEP, SharedArrayBuffer, boot failures. Use when WebContainers fail to boot, embeds don't load, or processes crash inside WebContainers. Trigger: "stackblitz error", "webcontainer error", "SharedArrayBuffer not defined".
Best use case
stackblitz-common-errors is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Fix WebContainer and StackBlitz errors: COOP/COEP, SharedArrayBuffer, boot failures. Use when WebContainers fail to boot, embeds don't load, or processes crash inside WebContainers. Trigger: "stackblitz error", "webcontainer error", "SharedArrayBuffer not defined".
Teams using stackblitz-common-errors should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/stackblitz-common-errors/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How stackblitz-common-errors Compares
| Feature / Agent | stackblitz-common-errors | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Fix WebContainer and StackBlitz errors: COOP/COEP, SharedArrayBuffer, boot failures. Use when WebContainers fail to boot, embeds don't load, or processes crash inside WebContainers. Trigger: "stackblitz error", "webcontainer error", "SharedArrayBuffer not defined".
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
Related Guides
Best AI Skills for Claude
Explore the best AI skills for Claude and Claude Code across coding, research, workflow automation, documentation, and agent operations.
ChatGPT vs Claude for Agent Skills
Compare ChatGPT and Claude for AI agent skills across coding, writing, research, and reusable workflow execution.
SKILL.md Source
# StackBlitz Common Errors
## Error Reference
### SharedArrayBuffer is not defined
**Cause:** Missing cross-origin isolation headers.
```
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
```
**Fix:** Add both headers to your server. In Vite: `server.headers` config.
### Failed to boot WebContainer
**Cause:** Only one WebContainer instance allowed per page.
```typescript
// BAD: Multiple boot calls
const wc1 = await WebContainer.boot();
const wc2 = await WebContainer.boot(); // Fails!
// GOOD: Singleton pattern
let instance: WebContainer | null = null;
async function getWC() {
if (!instance) instance = await WebContainer.boot();
return instance;
}
```
### npm install hangs or fails
**Cause:** Large dependency tree or network issue in WebContainer.
```typescript
// Use --prefer-offline and minimal deps
const proc = await wc.spawn('npm', ['install', '--prefer-offline']);
const code = await proc.exit;
if (code !== 0) {
console.error('Install failed, retrying...');
const retry = await wc.spawn('npm', ['install']);
await retry.exit;
}
```
### server-ready event never fires
**Cause:** Application not listening on a port.
```typescript
// Ensure your app calls listen()
// app.listen(3000) -- required for server-ready event
// Also check process exit code for crashes
wc.on('error', (err) => console.error('WC error:', err));
```
### File operations fail with ENOENT
**Cause:** Parent directory doesn't exist.
```typescript
// Create parent directories first
await wc.fs.mkdir('/src/components', { recursive: true });
await wc.fs.writeFile('/src/components/Button.tsx', content);
```
## Quick Diagnostic
```typescript
// Check WebContainer state
async function diagnose(wc: WebContainer) {
try {
await wc.fs.readdir('/');
console.log('FS: OK');
} catch { console.error('FS: FAILED'); }
try {
const proc = await wc.spawn('node', ['-v']);
await proc.exit;
console.log('Node: OK');
} catch { console.error('Node: FAILED'); }
}
```
## Error Handling
| Error | Retryable | Action |
|-------|-----------|--------|
| Missing COOP/COEP | No | Fix server headers |
| Multiple boot | No | Use singleton pattern |
| npm install fail | Yes | Retry once, then report |
| ENOENT | No | Create parent dirs |
| Process crash | Yes | Restart process |
## Resources
- [WebContainer API Reference](https://webcontainers.io/api)
- [Browser Compatibility](https://webcontainers.io/guides/browser-support)
## Next Steps
For debugging, see `stackblitz-debug-bundle`.Related Skills
workhuman-common-errors
Workhuman common errors for employee recognition and rewards API. Use when integrating Workhuman Social Recognition, or building recognition workflows with HRIS systems. Trigger: "workhuman common errors".
wispr-common-errors
Wispr Flow common errors for voice-to-text API integration. Use when integrating Wispr Flow dictation, WebSocket streaming, or building voice-powered applications. Trigger: "wispr common errors".
windsurf-common-errors
Diagnose and fix common Windsurf IDE and Cascade errors. Use when Cascade stops working, Supercomplete fails, indexing hangs, or encountering Windsurf-specific issues. Trigger with phrases like "windsurf error", "fix windsurf", "windsurf not working", "cascade broken", "windsurf slow".
webflow-common-errors
Diagnose and fix Webflow Data API v2 errors — 400, 401, 403, 404, 409, 429, 500. Use when encountering Webflow API errors, debugging failed requests, or troubleshooting integration issues. Trigger with phrases like "webflow error", "fix webflow", "webflow not working", "debug webflow", "webflow 429", "webflow 401".
vercel-common-errors
Diagnose and fix common Vercel deployment and function errors. Use when encountering Vercel errors, debugging failed deployments, or troubleshooting serverless function issues. Trigger with phrases like "vercel error", "fix vercel", "vercel not working", "debug vercel", "vercel 500", "vercel build failed".
veeva-common-errors
Veeva Vault common errors for REST API and clinical operations. Use when working with Veeva Vault document management and CRM. Trigger: "veeva common errors".
vastai-common-errors
Diagnose and fix Vast.ai common errors and exceptions. Use when encountering Vast.ai errors, debugging failed instances, or troubleshooting GPU rental issues. Trigger with phrases like "vastai error", "fix vastai", "vastai not working", "debug vastai", "vastai instance failed".
twinmind-common-errors
Diagnose and fix TwinMind common errors and exceptions. Use when encountering transcription errors, debugging failed requests, or troubleshooting integration issues. Trigger with phrases like "twinmind error", "fix twinmind", "twinmind not working", "debug twinmind", "transcription failed".
together-common-errors
Together AI common errors for inference, fine-tuning, and model deployment. Use when working with Together AI's OpenAI-compatible API. Trigger: "together common errors".
techsmith-common-errors
TechSmith common errors for Snagit COM API and Camtasia automation. Use when working with TechSmith screen capture and video editing automation. Trigger: "techsmith common errors".
supabase-common-errors
Diagnose and fix Supabase errors across PostgREST, PostgreSQL, Auth, Storage, and Realtime. Use when encountering error codes like PGRST301, 42501, 23505, or auth failures. Use when debugging failed queries, RLS policy violations, or HTTP 4xx/5xx responses. Trigger with "supabase error", "fix supabase", "PGRST", "supabase 403", "RLS not working", "supabase auth error", "unique constraint", "foreign key violation".
stackblitz-webhooks-events
WebContainer lifecycle events: server-ready, port changes, error handling. Use when working with WebContainers or StackBlitz SDK. Trigger: "webcontainer events".