菜单
Use when editing CSS, SCSS, or style blocks in .svelte files. Covers CSS-specific code style rules. Auto-invoke when writing or modifying styles.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
MSW 2 (Mock Service Worker) mocking in Svelte: Storybook, Vitest browser tests, SvelteKit dev/SSR. Use when writing handlers or fixtures, when a story renders blank or errors Failed to fetch, or when migrating msw-storybook-addon v2 to v3.
Vitest test.projects, browser mode with playwright(), optimizeDeps, separate vitest.config from vite.config. Use when editing vitest config, debugging flaky browser tests, upgrading @vitest/*, or splitting node vs browser projects.
Svelte CSF (@storybook/addon-svelte-csf) + @storybook/addon-vitest: .stories.svelte as Vitest browser tests with play functions and tags. Use when wiring or debugging Svelte Storybook tests in Vitest/CI, not for React/Vue/CSF3 .ts story files.
Validation discipline for all code changes, testing, baselines, browser checks, CSS screenshots. Auto-invoke whenever making code changes, running tests, or declaring a task done.
Storybook workflow, MCP tools, fixtures, CSS import chains. Auto-invoke when working with Storybook stories or components.
Fix and create Svelte 5 tests with vitest-browser-svelte and Playwright. Use when fixing broken tests, debugging failures, writing unit/SSR/e2e tests, or working with vitest/Playwright.
| name | code-style-css |
| description | Use when editing CSS, SCSS, or style blocks in .svelte files. Covers CSS-specific code style rules. Auto-invoke when writing or modifying styles. |
| user-invocable | true |
&. For the full nesting workflow (specificity analysis, block ordering, stylelint compliance), use frontend:css-nesting.