周末花束
¥128 · 改的是标题这一行。
购物车1
工程与栈 · Web 技术
ViteVite
Vite 在开发期按需给模块、改一行只热替换那一块，预览里的状态可以留下；上线才走 build 打出 dist。
先认出这扇预览窗，再保存那一行
下面就是花店预览：默认标题已经热替换成周末花束，购物车还是 1。整页重打包，空车也写在同一扇窗上。
HMR · 购物车 1：新标题和计数长在预览窗里。
原因：Vite 只换改过的模块，预览窗里的计数还在。下一步：点「整页重打包」，看购物车会不会归零。
知识点：开发期按需热替换
窗上的标题和购物车已经演示了差异，这里只命名四条。
- dev 时浏览器按需要模块，不先打一个大包。
- 改一行只换那一块，组件状态可以留下。
- build 才会产出 dist，和热替换不是同一件事。
- 离开后要盯：README 写清 npm run dev 和 build，环境变量前缀约定好。
什么时候用、怎么用
本地改前端要立刻看见结果时用 Vite；已经在生产 CDN 上的包不靠它热替换。
- 信号：改文案要等整页刷新、计数总被清掉、dev 启动很慢。
- 适用：React / 现有框架的本地开发与生产构建。
- 不适用：把 HMR 当成上线方案——线上走 build 后的产物。
- 最短路径：npm run dev 打开预览 → 改一行保存 → 看物件变了、状态还在。
正反例：同一扇花店预览
目标都是改标题，只改更新方式。
购物车还是 1。结果长在预览窗里。
标题回去了，车也空了。失败写在数字上。
快速自测
改了一行标题，预览里购物车却变成 0，最可能是什么？
继续查证
术语的技术定义和行为以这些一手或权威资料为准。
下一步学
和本知识点经常一起出现的概念。