From stackblitz-pack
Fixes StackBlitz/WebContainer errors: COOP/COEP headers, SharedArrayBuffer, boot failures, npm hangs, ENOENT. Includes diagnostics and TypeScript patterns for retries/singletons.
How this skill is triggered — by the user, by Claude, or both
Slash command
/stackblitz-pack:stackblitz-common-errorsThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
**Cause:** Missing cross-origin isolation headers.
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.
Cause: Only one WebContainer instance allowed per page.
// 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;
}
Cause: Large dependency tree or network issue in WebContainer.
// 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;
}
Cause: Application not listening on a port.
// 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));
Cause: Parent directory doesn't exist.
// Create parent directories first
await wc.fs.mkdir('/src/components', { recursive: true });
await wc.fs.writeFile('/src/components/Button.tsx', content);
// 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 | 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 |
For debugging, see stackblitz-debug-bundle.
npx claudepluginhub jeremylongshore/claude-code-plugins-plus-skills --plugin stackblitz-packInstalls WebContainer API and StackBlitz SDK for browser-based Node.js and project embedding. Configures COOP/COEP headers for Vite/Express servers.
Diagnoses and fixes common Replit errors: container sleep, port binding, Nix failures, DB limits. For debugging workspaces, deployments, and hosting issues.
Creates, edits, and optimizes skills for Claude Code, including drafting, evaluating with test prompts, iterating on performance, and improving skill descriptions for better triggering accuracy.