English
vite-plugin-shopify-theme
代码拆分与 Theme 资源
判断 Shopify Theme 何时用动态导入或构建分组拆分代码，并验证扁平 assets 目录中的 chunk 命名、引用、预加载和旧资源清理。
代码拆分由宿主项目的导入方式和 Vite 构建配置决定，不是插件开关。只有在加载边界和缓存收益明确时才拆分；小型 Theme 入口保留单文件通常更容易验证和交付。
动态 import() 适合非首屏、按交互加载的能力，会产生异步 chunk；在 build.rolldownOptions.output 中配置 Rolldown 的 codeSplitting 分组，适合需要独立缓存的初始依赖，会产生初始 chunk。
产物规则
- 入口保持稳定文件名（
vite-mixer.js、vite-mixer.css），由 Mixer 通过asset_url引用，版本参数负责缓存破除。 - chunk 和异步 CSS 按内容寻址命名为
vite-mixer.[name].[hash].js|css，并相对导入它的模块加载，因为 Shopify 把assets/作为一个扁平目录提供。构建因此使用相对base。 - 初始 chunk 会在 Mixer 中生成
<link rel="modulepreload">；动态导入的 chunk 按需加载，不写入 Mixer。
保留命名与清理
带中间段的 vite-mixer.*.js|css 是插件保留的命名空间。每次构建后，插件会删除该命名空间中不属于本次构建的文件，因此不要用这类名称手工维护资源。提交时把删除的旧 chunk 和新增产物放在同一次变更中。拆分后逐项检查入口文件名是否稳定、预加载链接、按需请求和清理结果。精确规则见仓库的代码拆分说明。