vite-plugin-shopify-theme 面向仍使用标准 Shopify Theme 目录、但希望用 Vite 管理前端源码和开发反馈的团队。它同时提供 Vite 插件和 Theme Run 命令行入口，让本地开发、生产构建、推送与打包使用同一套 Theme Target 解析和交付检查。

它解决什么问题

直接把 Vite 和 Shopify CLI 拼在一起时，开发服务器地址、生产资源、Liquid 引用、Git 工作区和推送前检查容易各自形成一套约定。这个产品把这些交界处收敛成一个工作流：Vite 仍负责前端模块和构建，Shopify CLI 仍负责商店、远端 Theme、认证及其原生参数，插件负责二者之间的 Theme 资源连接。

适合谁

使用标准 Shopify Theme，而不是 Headless Storefront；
希望获得 Vite HMR、模块化源码和生产构建能力；
需要在构建、推送和打包前执行同一套生产检查；
愿意把生成的 Mixer Snippet 和生产资源纳入明确的 Git 工作流。

如果当前项目只使用 Shopify 原生主题资源、没有独立前端源码入口，引入额外构建层未必有收益。开始前先确认团队愿意维护 Vite 配置，目标环境具备 Node.js 22.14 或更高版本、Vite 8 和可执行的 Shopify CLI。

能力边界

插件不代替 Shopify CLI 管理商店、认证、远端 Theme ID 或环境配置，也不选择 CSS、JavaScript 框架。宿主项目继续负责源码入口、别名和开发服务器传输设置；插件负责 Theme Target、资源输出、Mixer Snippet、开发重载及生产检查。

先读产品文档，再按需要进入配置、命令行工作流、Mixer 与 Git、局域网调试、代码拆分和故障排查。Shopify Theme 的通用结构与交付原则仍在主题架构和Theme 交付框架维护。

产品许可

vite-plugin-shopify-theme 的使用以其源码仓库中的许可证为准。

产品文档

vite-plugin-shopify-theme 文档

vite-plugin-shopify-theme 文档入口：从最小接入开始，依次理解配置边界、Theme Run 命令、Mixer 与 Git 及故障排查。

安装并启动开发

在宿主项目中安装插件，声明前端入口，并用 Theme Run 启动 Vite 与 Shopify Theme 开发。

配置边界

区分宿主 Vite 配置、插件职责和 Shopify CLI 参数的边界，列出全部插件选项与默认值，避免直接 Vite 构建与 Theme Run 得到不同结果。

Theme Run 命令行工作流

按开发、构建、推送、打包、诊断和恢复任务选择 Theme Run 命令，区分 build、push、package 的职责与每一步的完成标准。

Mixer Snippet 与 Git

说明 Mixer Snippet 在开发与生产形态间的切换、进入开发前 Git index 须有生产形态的前提，以及异常退出后用 restore 恢复。

手机与局域网调试

让移动设备访问 Shopify 预览和 Vite 资源，并识别局域网 HTTP 与远端 HTTPS 的混合内容边界。

代码拆分与 Theme 资源

判断 Shopify Theme 何时用动态导入或构建分组拆分代码，并验证扁平 assets 目录中的 chunk 命名、引用、预加载和旧资源清理。

故障排查

先用 doctor 读取插件状态，再从 Theme Target、开发分支检查、目标锁、Mixer、Git、生产检查和网络边界定位 Theme Run 的开发或交付失败。

vite-plugin-shopify-theme

它解决什么问题

适合谁

能力边界

产品许可

获取方式

产品文档

查阅实现，按任务阅读文档。