用途：这是一份“模式与陷阱”技能，而非教程，面向使用 Vite + Tailwind CSS v4 + 单目录组件（SDC）、通过 drupal/vite 模块构建的 Drupal 10/11 服务端渲染主题。目标是让主题随规模增长仍保持快速：匿名页面可整页缓存、JS 接近零、按路由的 CSS 次线性增长。已验证版本为 drupal/vite 1.5.1、Drupal core 11.4、Vite 6.4、Tailwind CSS 4.3（@tailwindcss/vite 4.3），升级后需重新核对与版本绑定的结论。
主要能力：覆盖开发服务器探测陷阱（在 settings.php 中显式设置 $settings['vite'] = ['useDevServer' => FALSE]，避免冷构建时对 http://localhost:5173 的探测拖慢渲染甚至 504）；内容哈希文件名与不要给 Vite 管理的库加 version: 键；反单体资源规则（preprocess: false、避免 glob @import、按路由挂载库）；掌控标记（base theme: false、扁平模板、libraries-override / libraries-extend）；复用规则（颜色走 token、两处以上使用即抽 SDC 组件）；近零 JS（跨文档 View Transitions、Speculation Rules 预渲染、保持匿名路由可缓存）；以及 Tailwind v4 的若干坑（@theme token 只在导入 tailwindcss 的入口生效、preflight 对 img/video、列表、[hidden] 的影响、自动源扫描误扫注释、display: contents 的适用条件）。
使用方式：技能在构建或重构 Vite/Tailwind v4/SDC 主题、编辑 vite.config.js、mytheme.libraries.yml、mytheme.info.yml 或 settings.php 的 $settings['vite']、排查冷渲染慢或 504、部署后资源 404 或陈旧、Tailwind v4 异常、提交前审查主题改动时激活。本地 HMR 可在 gitignored 的 settings.local.php 中用 $settings['vite']['overrides']['mytheme']['useDevServer'] = TRUE 临时开启，随后 npm run dev 与 drush cr。
适用场景与限制：适用于 Drupal 主题的构建侧（库接线、哈希资源、SDC）。若主题还包含 React、Vue、Angular、Svelte、Alpine 等 JS 框架，需另找对应框架技能并遵循其安全建议；drupalSettings 的缓存上下文可参考 drupal-performance，标记应使用 processed 而非原始字段值。资料未提供收费、价格或平台信息。