Vite 插件的 handleHotUpdate 钩子能做什么,与默认 HMR 流程如何配合?
围绕“Vite 插件的 handleHotUpdate 钩子能做什么,与默认 HMR 流程如何配合”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出过滤/修改受影响模块列表、自定义更新或触发 full reload 的能力及返回值约定。
构建工具专题面试题第 4 页,显示第 151–200 题,共找到 211 道完整解析,可继续按分类、标签与关键词缩小范围。
按稳定语义路径排序
围绕“Vite 插件的 handleHotUpdate 钩子能做什么,与默认 HMR 流程如何配合”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出过滤/修改受影响模块列表、自定义更新或触发 full reload 的能力及返回值约定。
围绕“Vite 插件与 Rollup 插件的兼容关系是什么,哪些 Rollup 插件不能直接用于开发期”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 Vite 复用 Rollup 插件接口但开发期有额外钩子的关系,以及 build 专用钩子在 dev 下不生效的判断。
围绕“Vite 插件的 transform 钩子如何按文件类型过滤,为什么官方推荐用 filter 而非在钩子里判断”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 transform 钩子的 include/exclude filter 让 Vite 跳过无关模块以省掉 JS 侧调用开销。
围绕“如何用 Vite 插件实现虚拟模块(virtual module)并正确处理其缓存失效”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 resolveId/load 配对、 前缀约定及 this.emitFile/失效处理方式。
围绕“Vite 依赖预构建的缓存何时会失效并触发重新构建”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 lockfile 变化、config 中 optimizeDeps 相关配置变化、强制 --force 等失效条件。
围绕“Vite 中放在 public 目录的资源与通过 import 引入的资源在处理上有何本质区别”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 public 原样复制不哈希不压缩、import 资源走构建管道带哈希的判断。
围绕“Vite 的中间件模式(middleware mode)如何用于开发期 SSR,为什么开发时不需要 SSR 构建”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 createServer middlewareMode 挂到自有服务器并用 ssrLoadModule 按需加载服务端模块的机。
围绕“用 Vite 做 SSR 时,客户端入口与服务端入口如何组织,ssr build 的产物与客户端构建有何不同”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出双入口结构与 vite build --ssr 生成 Node 可加载产物(无资源哈希清单)的区别。
围绕“Vite SSR 中依赖为什么默认被 external 由 Node 直接加载,ssr.noExternal 什么时”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 SSR 外置依赖减少转译开销的默认策略及对 CJS-only/含 CSS 的包需 noExternal 内联处理的判断。
围绕“Vite 的 HMR 为什么随项目规模增大仍能保持接近常量的更新速度”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出 HMR 只失效并重取变更模块链而非重打包整图的原理,不与 webpack HMR 做全面对比。
围绕“Vite 开发服务器基于原生 ESM 按需编译,相比 bundle 式开发服务器解决了什么问题”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要答出源码与依赖分离、请求级按需转译带来的冷启动和更新速度优势。
围绕“Vite 为什么在开发阶段要做依赖预构建(Dep Pre-Bundling)”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖必须答出 CJS/UMD 转 ESM 与减少模块请求数这两个动机。
围绕“Vue 项目里路由懒加载的分包如何通过 prefetch 或 preload 提前获取而不阻塞首屏”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要明确 prefetch 利用浏览器空闲带宽预取后续路由、preload 与当前路由并行加载关键资源,及魔法注释配置方式。
围绕“Pinia 如何配置才能让 store 在 Vite 热更新时保留状态”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要明确在 store 模块末尾用 acceptHMRUpdate 注册以在模块替换后迁移 state。
围绕“Vue Router 的路由懒加载如何通过动态 import 实现,如何控制打包产物按路由分组”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要明确路由 component 用 () => import() 触发按需加载与构建器自动分包,及命名 chunk 合并相关路由的做法。
围绕“如何检测浏览器是否支持某个 WebAssembly 特性(如 SIMD、线程)”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖给出用最小特征字节码 validate 检测的通用方法与回退构建策略,不列全部特性常量。
围绕“Webpack 5 的 asset modules 有哪几种类型,如何替代 file-loader 和 url-lo”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要对比四种 asset 类型及 dataUrl 阈值决策,不讲旧版 loader 的迁移步骤细节。
围绕“Webpack babel-loader 的 cacheDirectory 选项如何提升二次构建速度”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖解释 loader 级磁盘缓存的命中条件与失效因素,不对比 webpack 5 持久化缓存。
围绕“Webpack 官方建议的构建性能优化手段有哪些,应按什么顺序排查”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖给出版本升级、缩小 resolve 范围、减少 plugin/loader 开销等优先级,不深入持久化缓存细节。
围绕“发现 Webpack 产物体积异常增大,如何用 webpack-bundle-analyzer 定位问题”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明从产物 stats 到可视化定位重复依赖与大模块的流程,不讲瘦身手段本身。
围绕“如何利用 Webpack 的 contenthash 与 runtime chunk 实现稳定的长效缓存”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明内容哈希命名与运行时代码抽离避免缓存级联失效,不讲 Service Worker 缓存。
围绕“Webpack 实现代码分割有哪几种方式,各自适合什么场景”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要对比入口分割、SplitChunksPlugin、动态 import 三条路径,不深入缓存组配置细节。
围绕“Webpack 中 css-loader 和 style-loader 各自负责什么,为什么生产环境要换成 Mini”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖区分模块化解析与注入 DOM 的职责及抽离 CSS 的收益,不讲 CSS Modules 配置。
围绕“Webpack DefinePlugin 在打包时做了什么,和运行时环境变量有什么区别”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明编译期文本替换的本质及与 process.env 运行时读取的差异,不讲 mode 与环境配置管理。
围绕“Webpack 的依赖图是如何从入口开始构建的,它对输出有什么决定作用”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖回答从 entry 递归解析 import/require 生成模块图的过程。
围绕“如何组织 Webpack 配置以共用公共部分并区分开发与生产环境”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖给出公共配置与 webpack-merge 拆分的环境组织方式,不讲具体环境优化项。
围绕“Webpack devtool 各取值(eval、cheap、source-map)在构建速度和调试质量上如何取舍”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要对比生成/重建速度与映射精度,为开发与生产分别给结论,不讲 SourceMap 文件格式。
围绕“如何发现并解决 Webpack 产物中同一依赖被打包多份的问题”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖回答需要围绕用 stats/analyzer 定位多版本依赖并通过 alias 或依赖升级归一,不讲分包策略。
围绕“Webpack 中动态 import() 是如何触发按需加载的,产物形态有什么变化”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖解释异步 chunk 生成与运行时加载(jsonp/chunk loading)流程,不讲预加载提示。
围绕“Webpack 的 entry 配置支持哪些形式,多入口和单入口的产物有何区别”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖区分 string、数组、对象形式的 entry 及其对 chunk 生成的影响,不讲 output 的 hash 策略。
围绕“Webpack externals 的作用是什么,和 code splitting 解决的问题有何不同”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖区分不打包改由运行时全局变量/CDN 提供与拆分后仍由 webpack 加载两种路径,不讲库开发场景。
围绕“Webpack HMR 热模块替换在构建与运行时层面分别做了什么”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明增量编译产物与运行时模块替换、accept 回调的流程,不讲框架级 fast refresh。
围绕“HtmlWebpackPlugin 解决了什么问题,它如何自动注入带 hash 的产物”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖解释 HTML 生成与 chunk 引用注入的时机。
围绕“Webpack 5 的 innerGraph 优化相比基础 tree shaking 多解决了什么问题”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖解释跨语句的使用跟踪(如类方法、立即赋值的导出)带来的更精细摇树,不讲配置开关细节。
围绕“用 Webpack 实现路由级懒加载时,如何控制生成的 chunk 名称与加载失败处理”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要讲清 webpackChunkName 注释与加载错误兜底思路,不讲框架路由配置本身。
围绕“Webpack rule.enforce 的 pre 和 post 有什么作用,能解决什么问题”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明 pre/normal/post 三类 loader 的分层与排序优先级。
围绕“Webpack 多个 loader 的执行顺序是怎样的,为什么 babel-loader 要写在最后”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖回答 loader 从右到左(normal 阶段)及 pitching 阶段的顺序规则,不讲如何编写自定义 loader。
围绕“Webpack loader 的 pitching 阶段是什么,什么场景下会跳过剩余 loader”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖解释 pitch 函数前置执行与提前返回短路后续 loader 的机制,不讲 inline loader 语法细节。
围绕“Webpack 中 loader 和 plugin 的职责边界是什么,同一需求应如何判断用哪个”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖按模块转换与构建流程扩展划分职责,给出判断标准,不罗列常见插件清单。
围绕“Webpack 的 mode 设置为 development 和 production 分别默认开启了哪些优化”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖回答需要围绕列举两种模式默认开启的插件与优化项差异,不讲自定义 mode 配置。
围绕“Webpack 的 moduleIds 和 chunkIds 配置为什么会影响产物 hash 的稳定性”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖解释 deterministic ID 如何避免新增模块导致无关 chunk 哈希变化,不讲哈希算法选择。
围绕“Webpack output.filename 中 [name]、[contenthash]、[chunkhash]”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明三种替代标记的生成依据与缓存意义。
围绕“Webpack 5 的 filesystem 持久化缓存缓存了什么,什么情况下会自动失效”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明构建中间结果落盘与基于文件快照的失效机制,不讲 loader 自身缓存。
围绕“Webpack plugin 是如何通过 compiler 和 compilation 钩子介入构建过程的”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖回答基于 Tapable 的钩子注册与生命周期介入机制,不讲具体某个插件的用法。
围绕“Webpack 中 webpackPrefetch 和 webpackPreload 魔法注释分别产生什么效果”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖区分浏览器空闲预取与并行预载的优先级差异及资源提示生成,不讲动态 import 机制本身。
围绕“Webpack ProvidePlugin 适合解决什么问题,为什么能免去重复 import”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明模块标识符自动注入的机制与适用场景,不对比 externals。
围绕“Webpack output.publicPath 决定什么,设置为自动值或 CDN 地址各有什么影响”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明运行时资源 URL 拼接的依据及按需 chunk 加载失败与 publicPath 的关系,不讲 devServer 的同名配置。
围绕“什么情况下应该用 Webpack 的 asset/source 类型而不是普通打包”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖判断需要原样字符串内容(如 shader、SVG 源码)的场景。
围绕“Webpack resolve.alias 能解决哪些实际问题,配置时有什么容易踩的坑”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要讲清路径简化与模块替换两类用途及后缀/精确匹配陷阱,不讲解析性能。
围绕“Webpack resolve 的 extensions、alias、modules 配置如何影响构建速度”给出直接结论、机制拆解、可复现验证、常见误区与追问,重点覆盖需要说明解析请求数量与文件系统探测开销的关系,不讲 alias 的业务用法。