第 4 章本地开发服务器

用动态构建、HMR、Mock与SSR缩短本地反馈，同时守住生产契约；用体系节点、故障轨迹和发布门完成独立复核。

学习目标

能说明“第 4 章本地开发服务器”如何用动态构建、HMR、Mock与SSR缩短本地反馈，同时守住生产契约，并保持2018原书目录与现代技术对照的边界
能先预测“怎样在不完整重载的情况下更新模块，又证明状态、接口和服务端渲染没有被本地便利掩盖？”的正常路径，再沿输入、动作、产物和责任逐阶段核对
能注入“Mock返回生产不可能出现的数据形状，HMR又保留旧状态，使缺陷只在部署后出现”，用“本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新”决定接受、缩小或拒绝交付

为什么从这个交付任务开始

本地开发服务器页把速度和真实性并列：webpack的HMR会生成更新清单与更新块，但模块没有可接受边界时必须向上冒泡并最终回退。 “第 4 章本地开发服务器”使用的贯穿任务是：开发服务器在内存中构建前端，代理异步接口并支持SSR；一次字段变更在热更新中看似正常，整页刷新却失败。操作前先预测哪个阶段最先产生差异，运行后再补解释不算预测。

本页围绕“怎样在不完整重载的情况下更新模块，又证明状态、接口和服务端渲染没有被本地便利掩盖？”建立正常、故障与恢复路径。只有“第 4 章本地开发服务器”保持“本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新”并交付文件变更、编译哈希、更新模块、接受边界、保留状态、刷新回退、接口契约和SSR结果。，工具运行结果才构成工程证据。

书目、98条目与时代边界

“第 4 章本地开发服务器”以豆瓣书目与完整目录核对周俊鹏著、电子工业出版社、2018年1月、224页、ISBN 9787121330902和七章结构；天瓏书店目录为“第 4 章本地开发服务器”提供第二份逐节顺序核对。公开材料合计列出98个章、节和小节层级条目，课程不把现代对照增列为原书章节。

“第 4 章本地开发服务器”当前只能取得书目简介与详细目录，没有可授权逐段改写的完整正文。本页的解释、架构、交互、练习和答案均为独立教学重写；webpack、Yeoman、Node.js等名称按2018目录定位，现代文档不反向证明原书当年的具体版本行为。

“第 4 章本地开发服务器”另以技术核对 1、技术核对 2核对技术事实。对本页而言，Node、webpack、Babel、PostCSS、Git或WebHook文档说明当前机制；2022年的RFC 9111是HTTP缓存的现代标准，不能冒充2018年原书引用的历史规范。现代Vite、Module Federation、TypeScript测试体系或RUM若出现，只能标为迁移讨论，不能改写98条目分母。

公开目录条目与工程机制

第4章本地开发服务器

公开坐标 1/10。 在“第 4 章本地开发服务器”的条目1中，第4章本地开发服务器用于把文件变化连接内存编译；先声明工程输入与责任人，再用编译哈希、错误和响应复核产物，出现开发语义偏离生产时不能继续交付。

4.1 本地开发服务器解决的问题

公开坐标 2/10。 4.1 本地开发服务器解决的问题进入“第 4 章本地开发服务器”后要回答第2张证据卡：它怎样把文件变化连接内存编译、向下一阶段交付什么、由哪些编译哈希、错误和响应证明，并怎样排除开发语义偏离生产。

4.2 动态构建

公开坐标 3/10。 围绕“怎样在不完整重载的情况下更新模块，又证明状态、接口和服务端渲染没有被本地便利掩盖？”，坐标3把4.2 动态构建解释为把文件变化连接内存编译；独立复核者先读取编译哈希、错误和响应再判断工程状态，不能接受开发语义偏离生产这种捷径。

4.2.1 webpack-dev-middleware

公开坐标 4/10。 对“第 4 章本地开发服务器”而言，4.2.1 webpack-dev-middleware的最小合同是由依赖图编排工程能力，第4次检查保存入口、模块、产物和边界；若产生打包器包办所有职责，就回到上游版本和契约重新验证。

4.2.2 Livereload和HMR

公开坐标 5/10。 第5个公开条目4.2.2 Livereload和HMR服务于用动态构建、HMR、Mock与SSR缩短本地反馈，同时守住生产契约，需要以模块边界、状态和刷新回退呈现用更新清单替换可接受模块；热更新掩盖冷启动会破坏“本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新”，因此属于拒绝条件。

4.3 Mock服务

公开坐标 6/10。 学习者在“第 4 章本地开发服务器”中讨论4.3 Mock服务前预测用契约生成可控接口情境会改变哪项工程状态，再读取模式、状态码和延迟；观察到Mock形状超出生产时必须恢复已知产物，不能移动验收标准。

4.3.1 Mock的必要前提和发展进程

公开坐标 7/10。 开发服务器在内存中构建前端，代理异步接口并支持SSR；一次字段变更在热更新中看似正常，整页刷新却失败。在条目7处理4.3.1 Mock的必要前提和发展进程时，要把用契约生成可控接口情境写进流水线，把模式、状态码和延迟写进运行记录，并把Mock形状超出生产写进失败样本。

4.3.2 异步数据接口

公开坐标 8/10。 “本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新”限定了4.3.2 异步数据接口的适用域：条目8只能通过用契约生成可控接口情境推进交付，由模式、状态码和延迟复核，而Mock形状超出生产构成反事实检查。

4.3.3 SSR

公开坐标 9/10。 在“第 4 章本地开发服务器”的条目9中，4.3.3 SSR用于在服务端生成首屏输出；先声明工程输入与责任人，再用请求上下文、数据和水合复核产物，出现服务端浏览器环境混同时不能继续交付。

4.4 总结

公开坐标 10/10。 4.4 总结进入“第 4 章本地开发服务器”后要回答第10张证据卡：它怎样封闭该章职责与证据、向下一阶段交付什么、由哪些正式条目和相邻章节证明，并怎样排除跨章任意混排。

先预测，再操作三个工程实验

分步1 / 3

1. 体系节点与交付契约

逐个选择“文件监听、内存编译、更新清单、浏览器状态、接口与SSR”，核对输入、动作、输出和门禁怎样连接“第 4 章本地开发服务器”。

体系节点

从版本化输入走到可晋级产物

怎样在不完整重载的情况下更新模块，又证明状态、接口和服务端渲染没有被本地便利掩盖？

版本化输入

“第 4 章本地开发服务器”的文件监听读取已版本化需求、模板或源码。

工程动作

按触发增量编译处理文件监听，不得读取未声明的可变输入。

可验证输出

文件监听输出带版本、哈希或运行ID的工程证据，供下一节点验证。

晋级门

若发生“Mock返回生产不可能出现的数据形状，HMR又保留旧状态，使缺陷只在部署后出现”，文件监听必须停止而非越过“本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新”。

公开目录坐标：第4章本地开发服务器、4.1 本地开发服务器解决的问题、4.2 动态构建、4.2.1 webpack-dev-middleware、4.2.2 Livereload和HMR、4.3 Mock服务、4.3.1 Mock的必要前提和发展进程、4.3.2 异步数据接口、4.3.3 SSR、4.4 总结

第 4 章本地开发服务器的可重放交付协议

阶段	工程动作	必留证据	拒绝条件
触发增量编译	按触发增量编译处理文件监听，不得读取未声明的可变输入。	提交、依赖、模板与配置版本	输入版本不完整
应用HMR或完整刷新	按应用HMR或完整刷新处理内存编译，不得读取未声明的可变输入。	运行ID、测试、清单与产物哈希	Mock返回生产不可能出现的数据形状，HMR又保留旧状态，使缺陷只在部署后出现
核对Mock、接口与SSR	按核对Mock、接口与SSR处理更新清单，不得读取未声明的可变输入。	审批、环境、入口与回滚目标	无法返回已验证产物

unit: "feng-unit-04"
question: "怎样在不完整重载的情况下更新模块，又证明状态、接口和服务端渲染没有被本地便利掩盖？"
scenario: "开发服务器在内存中构建前端，代理异步接口并支持SSR；一次字段变更在热更新中看似正常，整页刷新却失败。"
nodes: ["文件监听", "内存编译", "更新清单", "浏览器状态", "接口与SSR"]
stages: ["触发增量编译", "应用HMR或完整刷新", "核对Mock、接口与SSR"]
invariant: "本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新"
fault: "Mock返回生产不可能出现的数据形状，HMR又保留旧状态，使缺陷只在部署后出现"
evidence: "文件变更、编译哈希、更新模块、接受边界、保留状态、刷新回退、接口契约和SSR结果。"
reset: restore_node_mode_step_gates_and_artifact

该协议要求“第 4 章本地开发服务器”在相同提交、依赖锁、配置和外部服务下重放。重置后若节点、执行位置或发布门没有回到基线，交互状态已经污染比较，不能作为工程证据。

本页回顾

掌握“第 4 章本地开发服务器”不是记住工具命令，而是能围绕“怎样在不完整重载的情况下更新模块，又证明状态、接口和服务端渲染没有被本地便利掩盖？”重建工程状态，并用“本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新”拒绝“Mock返回生产不可能出现的数据形状，HMR又保留旧状态，使缺陷只在部署后出现”。最终交付为文件变更、编译哈希、更新模块、接受边界、保留状态、刷新回退、接口契约和SSR结果。

练习与答案

练习

问题 1：工程合同。 “第 4 章本地开发服务器”为什么必须先声明提交、依赖、配置与责任边界？

问题 2：目录逐项覆盖。 怎样证明公开条目已经进入机制、交互和练习？

第4章本地开发服务器：以“把文件变化连接内存编译”解释工程作用，用“编译哈希、错误和响应”提供复核。
4.1 本地开发服务器解决的问题：以“把文件变化连接内存编译”解释工程作用，用“编译哈希、错误和响应”提供复核。
4.2 动态构建：以“把文件变化连接内存编译”解释工程作用，用“编译哈希、错误和响应”提供复核。
4.2.1 webpack-dev-middleware：以“由依赖图编排工程能力”解释工程作用，用“入口、模块、产物和边界”提供复核。
4.2.2 Livereload和HMR：以“用更新清单替换可接受模块”解释工程作用，用“模块边界、状态和刷新回退”提供复核。
4.3 Mock服务：以“用契约生成可控接口情境”解释工程作用，用“模式、状态码和延迟”提供复核。
4.3.1 Mock的必要前提和发展进程：以“用契约生成可控接口情境”解释工程作用，用“模式、状态码和延迟”提供复核。
4.3.2 异步数据接口：以“用契约生成可控接口情境”解释工程作用，用“模式、状态码和延迟”提供复核。
4.3.3 SSR：以“在服务端生成首屏输出”解释工程作用，用“请求上下文、数据和水合”提供复核。
4.4 总结：以“封闭该章职责与证据”解释工程作用，用“正式条目和相邻章节”提供复核。

问题 3：故障恢复。 怎样证明“Mock返回生产不可能出现的数据形状，HMR又保留旧状态，使缺陷只在部署后出现”已经被修正？

为“第 4 章本地开发服务器”复用同一提交、依赖锁、配置和外部服务，重放正常路径后只注入“Mock返回生产不可能出现的数据形状，HMR又保留旧状态，使缺陷只在部署后出现”；记录最早偏离阶段，撤销故障并再次运行。只有日志、清单、产物和文件变更、编译哈希、更新模块、接受边界、保留状态、刷新回退、接口契约和SSR结果。重新满足“本地路径使用与生产一致的接口和构建语义，HMR失败能退回完整刷新”，修正才可晋级。

名词解释

本章出现的专业名词，用大白话再讲一遍。

本地开发服务器: 对应“第4章本地开发服务器”；在“第 4 章本地开发服务器”中用于把文件变化连接内存编译，需要连接输入、产物、版本与责任。
本地开发服务器解决的问题: 对应“4.1 本地开发服务器解决的问题”；在“第 4 章本地开发服务器”中用于把文件变化连接内存编译，需要连接输入、产物、版本与责任。
动态构建: 对应“4.2 动态构建”；在“第 4 章本地开发服务器”中用于把文件变化连接内存编译，需要连接输入、产物、版本与责任。
工程条目4: 对应“4.2.1 webpack-dev-middleware”；在“第 4 章本地开发服务器”中用于由依赖图编排工程能力，需要连接输入、产物、版本与责任。
Livereload和HMR: 对应“4.2.2 Livereload和HMR”；在“第 4 章本地开发服务器”中用于用更新清单替换可接受模块，需要连接输入、产物、版本与责任。
Mock服务: 对应“4.3 Mock服务”；在“第 4 章本地开发服务器”中用于用契约生成可控接口情境，需要连接输入、产物、版本与责任。
Mock的必要前提和发展进程: 对应“4.3.1 Mock的必要前提和发展进程”；在“第 4 章本地开发服务器”中用于用契约生成可控接口情境，需要连接输入、产物、版本与责任。
异步数据接口: 对应“4.3.2 异步数据接口”；在“第 4 章本地开发服务器”中用于用契约生成可控接口情境，需要连接输入、产物、版本与责任。
SSR: 对应“4.3.3 SSR”；在“第 4 章本地开发服务器”中用于在服务端生成首屏输出，需要连接输入、产物、版本与责任。
总结: 对应“4.4 总结”；在“第 4 章本地开发服务器”中用于封闭该章职责与证据，需要连接输入、产物、版本与责任。

第 4 章 本地开发服务器

学习目标

为什么从这个交付任务开始

书目、98条目与时代边界

公开目录条目与工程机制

第4章 本地开发服务器

4.1 本地开发服务器解决的问题

4.2 动态构建

4.2.1 webpack-dev-middleware

4.2.2 Livereload和HMR

4.3 Mock服务

4.3.1 Mock的必要前提和发展进程

4.3.2 异步数据接口

4.3.3 SSR

4.4 总结

先预测，再操作三个工程实验

1. 体系节点与交付契约

从版本化输入走到可晋级产物

第 4 章 本地开发服务器的可重放交付协议

本页回顾

练习与答案

练习

名词解释

名词解释

讨论

第 4 章本地开发服务器

第4章本地开发服务器

第 4 章本地开发服务器的可重放交付协议