用途:为 TYPO3 v13/v14 LTS sitepackage 配置 Vite 7 构建,配合 praetorius/vite-asset-collector 处理前端资源。资料指出 TYPO3 v14.0 移除了核心内置的前端 CSS/JS 合并、压缩与 CSS 注释/空白剥离(Breaking #108055、#107944),config.concatenateCss/compressCss/concatenateJs/compressJs 不再生效,v14 生产级资源处理需外部构建工具。
主要能力:按内容元素(CE)设置入口点,每个 CE 使用独立 *.entry.ts 导入其 SCSS 与 TypeScript,实现代码分割,仅加载可见 CE 的 CSS/JS;Bootstrap 采用选择性导入,只引入用到的组件以减小 CSS 体积;自定义 SvgCopyOptimizePlugin 将 Resources/Private/Svg/ 中的 SVG 经 SVGO 处理输出到 Resources/Public/Svg/,开发模式支持文件监听;通过 vite:asset ViewHelper 加载的资源自动获得 nonce 属性以符合 CSP,无需内联 script/style。技术栈含 Vite 7+、Bootstrap 5.3+、PostCSS(autoprefixer + cssnano 生产)、SCSS 现代编译器 API(api: 'modern-compiler')、Gzip 与 Brotli 压缩,包管理器可用 npm、pnpm 或 yarn。
使用方式与限制:开发服务器默认启用 host 头校验,非允许主机返回 403 Blocked request,反向代理(Traefik、nginx)下会破坏 HMR;需显式列出代理主机名,如 allowedHosts: ['.ddev.site'],并在 cors 中允许相同来源,切勿使用 allowedHosts: true 或 cors: true,且选项须写在同一个 server 块内。构建后 TYPO3 页面缓存仍引用旧哈希文件名,需执行 vendor/bin/typo3 cache:flush 并核实实际提供的资源。详细配置见 references/vite-configuration.md、references/scss-architecture.md、references/bootstrap-theming.md。