Vite 构建时 sourcemap 有哪几种配置值，hidden 模式适用于什么发布流程？
围绕“Vite 构建时 sourcemap 有哪几种配置值，hidden 模式适用于什么发布流程”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 true/'hidden'/'inline' 的差异及 hidden 配合错误监控平台上传的流程。
核心关键词Vite build sourcemap hidden 配置
面试知识索引 · 分类、标签与搜索
前端工程化面试题，138 道完整答案
前端工程化面试题第 2 页，显示第 51–100 题，共找到 138 道完整解析，可继续按分类、标签与关键词缩小范围。
138筛选结果
52技术分类
178检索标签
3索引分页
快速定位
清除全部筛选分类、标签与关键词搜索
第 2 页
本页面试问题
按稳定语义路径排序
- 0051
- 0052
Vite 的 build.target 决定什么，为什么不直接用 browserslist？
围绕“Vite 的 build.target 决定什么，为什么不直接用 browserslist”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 target 控制语法降级与 esbuild 转译目标、默认 'modules' 基线，以及与 browserslist 的关。
核心关键词Vite build.target esbuild 目标浏览器 - 0053
Vite 生产构建的 chunk 是如何拆分的，什么时候需要用 manualChunks 手动控制？
围绕“Vite 生产构建的 chunk 是如何拆分的，什么时候需要用 manualChunks 手动控制”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 Rollup 默认动态导入拆 chunk 的行为及 manualChunks 解决循环依赖/缓存优化的场景。
核心关键词Vite chunk 拆分 manualChunks - 0054
Vite 应用构建时 CSS 代码分割如何避免异步 chunk 加载时的样式闪烁（FOUC）？
围绕“Vite 应用构建时 CSS 代码分割如何避免异步 chunk 加载时的样式闪烁（FOUC）”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 Vite 将异步 chunk 的 CSS 与其 JS 加载绑定、保证样式就绪后再执行的机制。
核心关键词Vite CSS 代码分割 FOUC 异步 chunk - 0055
Vite 在开发中发现未预构建的新依赖时为什么会整页刷新？
围绕“Vite 在开发中发现未预构建的新依赖时为什么会整页刷新”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出依赖发现延迟导致哈希变化、已有预构建产物失效需 full reload 的机制。
核心关键词Vite 新依赖预构建 整页刷新 - 0056
Vite 中动态 import() 如何实现路由级代码分割，魔法注释式的 chunk 命名是否可用？
围绕“Vite 中动态 import() 如何实现路由级代码分割，魔法注释式的 chunk 命名是否可用”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出动态导入产生独立 chunk、变量导入的受限分析与 chunkFileNames 命名方式。
核心关键词Vite 动态 import 代码分割 chunk 命名 - 0057
Vite 的 .env、.env.local、.env.[mode] 等文件加载优先级是怎样的？
围绕“Vite 的 .env、.env.local、.env.[mode] 等文件加载优先级是怎样的”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出各文件的加载顺序与覆盖规则及 local 文件不入库的实践。
核心关键词Vite env 文件加载优先级 mode - 0058
如何为 Vite 的自定义环境变量获得 TypeScript 类型提示？
围绕“如何为 Vite 的自定义环境变量获得 TypeScript 类型提示”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出扩展 ImportMetaEnv 接口与 vite/client 类型引用的做法。
核心关键词Vite 环境变量 TypeScript 类型 ImportMetaEnv - 0059
Vite 为什么默认只暴露 VITE_ 前缀的环境变量到客户端代码？
围绕“Vite 为什么默认只暴露 VITE_ 前缀的环境变量到客户端代码”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出防止密钥意外打入客户端 bundle 的安全考虑及 envPrefix 的修改方式。
核心关键词Vite 环境变量 VITE_ 前缀 安全 - 0060
Vite 为什么在开发期用 esbuild 而生产构建用 Rollup？
围绕“Vite 为什么在开发期用 esbuild 而生产构建用 Rollup”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 esbuild 的 Go 实现速度优势与 Rollup 插件生态/输出灵活性的取舍，不列举两者所有特性差异。
核心关键词Vite esbuild Rollup 分工 - 0061
Vite 的 import.meta.glob 与普通动态 import 相比解决了什么问题，eager 选项改变什么？
围绕“Vite 的 import.meta.glob 与普通动态 import 相比解决了什么问题，eager 选项改变什”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 glob 按模式批量生成导入映射及 eager 转静态导入的效果与 tree-shaking 影响。
核心关键词Vite import.meta.glob eager 批量导入 - 0062
Vite HMR 中 import.meta.hot.accept 的边界如何决定更新冒泡范围？
围绕“Vite HMR 中 import.meta.hot.accept 的边界如何决定更新冒泡范围”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出模块自身/依赖 accept 的判定规则和冒泡到整页刷新的条件。
核心关键词Vite HMR accept 边界 更新冒泡 - 0063
如何在 Vite 中用 hot.on / hot.send 实现自定义的 HMR 事件通信？
围绕“如何在 Vite 中用 hot.on / hot.send 实现自定义的 HMR 事件通信”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出服务端 ws.send 与客户端 hot.on 配对实现自定义事件的流程。
核心关键词Vite HMR 自定义事件 hot.on send - 0064
哪些改动会让 Vite HMR 退化为整页刷新（full reload）？
围绕“哪些改动会让 Vite HMR 退化为整页刷新（full reload）”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出无 accept 边界、config 文件变化、某些插件返回的失效等触发条件。
核心关键词Vite HMR 整页刷新 full reload 条件 - 0065
Vite HMR API 中 hot.invalidate 与 hot.prune 各自用于什么场景？
围绕“Vite HMR API 中 hot.invalidate 与 hot.prune 各自用于什么场景”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 invalidate 强制当前模块重新执行、prune 处理模块从依赖图中移除时的资源清理。
核心关键词Vite hot invalidate prune 区别 - 0066
Vite 中 import.meta.env 的访问是如何在构建期被静态替换的，动态键名为什么取不到值？
围绕“Vite 中 import.meta.env 的访问是如何在构建期被静态替换的，动态键名为什么取不到值”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出构建期静态字符串替换机制导致 import.meta.env[key] 动态访问失效。
核心关键词Vite import.meta.env 静态替换 动态访问 - 0067
Vite 默认构建不处理 API polyfill，需要兼容旧浏览器时应该怎么做？
围绕“Vite 默认构建不处理 API polyfill，需要兼容旧浏览器时应该怎么做”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 build.target 只管语法不管 API 的边界及 @vitejs/plugin-legacy/core-js 的方案。
核心关键词Vite 旧浏览器兼容 polyfill plugin-legacy - 0068
Vite 库模式构建时 CSS 是如何处理的，cssCodeSplit 对库产物有什么影响？
围绕“Vite 库模式构建时 CSS 是如何处理的，cssCodeSplit 对库产物有什么影响”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出库模式下 CSS 默认打进单文件/按 chunk 拆分的行为差异及 cssCodeSplit 的取舍。
核心关键词Vite 库模式 CSS 提取 cssCodeSplit - 0069
用 Vite 构建组件库时为什么要把 react 等依赖 external 掉，如何实现？
围绕“用 Vite 构建组件库时为什么要把 react 等依赖 external 掉，如何实现”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出避免把宿主依赖打进产物造成重复实例的问题及 rollupOptions.external/peerDependencies 的配。
核心关键词Vite 库模式 external rollupOptions peerDependencies - 0070
Vite 库模式下如何配置多入口与输出格式（es/cjs/umd）？
围绕“Vite 库模式下如何配置多入口与输出格式（es/cjs/umd）”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 build.lib 的 entry 多入口对象、formats 与 fileName 函数的配置方式。
核心关键词Vite 库模式 lib entry formats 多入口 - 0071
配合 Vite 库模式，package.json 的 main/module/exports/types 字段应如何设置？
围绕“配合 Vite 库模式，package.json 的 main/module/exports/types 字段应如何”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出各字段与产物文件名对应关系及 types 优先的解析顺序。
核心关键词Vite 库 package.json exports types 配置 - 0072
为什么在 vite.config.ts 中不能直接访问 .env 变量，loadEnv 的正确用法是什么？
围绕“为什么在 vite.config.ts 中不能直接访问 .env 变量，loadEnv 的正确用法是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出配置加载早于 env 注入的时序问题及 loadEnv(mode, cwd) 的用法。
核心关键词Vite vite.config loadEnv 使用 - 0073
Vite 构建压缩默认用 esbuild，什么时候需要切换到 terser？
围绕“Vite 构建压缩默认用 esbuild，什么时候需要切换到 terser”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 esbuild 速度快与 terser 压缩率/高级混淆能力的取舍及切换成本。
核心关键词Vite minify esbuild terser 对比 - 0074
Vite 中 mode 与 NODE_ENV 有什么区别，--mode staging 会影响什么？
围绕“Vite 中 mode 与 NODE_ENV 有什么区别，--mode staging 会影响什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 mode 决定 env 文件与 import.meta.env.MODE，NODE_ENV 控制包的行为分支及二者默认值。
核心关键词Vite mode NODE_ENV 区别 - 0075
Vite 构建产物中的 modulepreload 与 modulepreload polyfill 各自起什么作用？
围绕“Vite 构建产物中的 modulepreload 与 modulepreload polyfill 各自起什么作用”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 Vite 为入口和动态导入注入 preload 以并行化请求，及 polyfill 兼容不支持 modulepreload 的。
核心关键词Vite modulepreload polyfill 预加载 - 0076
在 monorepo 中，为什么被 link 的本地包在 Vite 里默认不会被预构建，如何修正？
围绕“在 monorepo 中，为什么被 link 的本地包在 Vite 里默认不会被预构建，如何修正”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 linked 包不被预构建的默认行为及 build.commonjsOptions/optimizeDeps.include 。
核心关键词Vite monorepo linked package 预构建 commonjs - 0077
Vite 中 new URL('./img.png', import.meta.url) 这种资源引用方式解决什么问题？
围绕“Vite 中 new URL('./img.png', import.meta.url) 这种资源引用方式解决什么问”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出其对动态路径资源做静态分析与打包的机制及适用场景（如 worker、模板字符串拼接的限制）。
核心关键词Vite new URL import.meta.url 静态资源 - 0078
什么场景下需要配置 Vite 的 optimizeDeps.include 和 exclude？
围绕“什么场景下需要配置 Vite 的 optimizeDeps.include 和 exclude”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 include 处理未在入口静态引入的依赖、exclude 保留为原生 ESM 等判断标准。
核心关键词Vite optimizeDeps include exclude 场景 - 0079
如何让一个 Vite 插件只在开发或只在构建时生效？
围绕“如何让一个 Vite 插件只在开发或只在构建时生效”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出插件 apply: 'serve'/'build' 或函数形式按 command 判断的做法。
核心关键词Vite 插件 apply serve build 条件生效 - 0080
Vite 插件中 config 钩子与 configResolved 钩子的职责分别是什么？
围绕“Vite 插件中 config 钩子与 configResolved 钩子的职责分别是什么”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 config 用于修改/追加配置（可被合并）、configResolved 拿到最终配置做初始化。
核心关键词Vite 插件 config configResolved 区别 - 0081
Vite 插件的 enforce: 'pre'/'post' 以及钩子执行顺序如何影响转换结果？
围绕“Vite 插件的 enforce: 'pre'/'post' 以及钩子执行顺序如何影响转换结果”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 alias/用户 pre/核心/普通/post/构建插件的排序规则及典型使用场景。
核心关键词Vite 插件 enforce 执行顺序 - 0082
Vite 插件的 handleHotUpdate 钩子能做什么，与默认 HMR 流程如何配合？
围绕“Vite 插件的 handleHotUpdate 钩子能做什么，与默认 HMR 流程如何配合”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出过滤/修改受影响模块列表、自定义更新或触发 full reload 的能力及返回值约定。
核心关键词Vite handleHotUpdate 自定义 HMR - 0083
Vite 插件与 Rollup 插件的兼容关系是什么，哪些 Rollup 插件不能直接用于开发期？
围绕“Vite 插件与 Rollup 插件的兼容关系是什么，哪些 Rollup 插件不能直接用于开发期”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 Vite 复用 Rollup 插件接口但开发期有额外钩子的关系，以及 build 专用钩子在 dev 下不生效的判断。
核心关键词Vite 插件 Rollup 插件 兼容性 - 0084
Vite 插件的 transform 钩子如何按文件类型过滤，为什么官方推荐用 filter 而非在钩子里判断？
围绕“Vite 插件的 transform 钩子如何按文件类型过滤，为什么官方推荐用 filter 而非在钩子里判断”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 transform 钩子的 include/exclude filter 让 Vite 跳过无关模块以省掉 JS 侧调用开销。
核心关键词Vite 插件 transform filter 过滤 性能 - 0085
如何用 Vite 插件实现虚拟模块（virtual module）并正确处理其缓存失效？
围绕“如何用 Vite 插件实现虚拟模块（virtual module）并正确处理其缓存失效”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 resolveId/load 配对、 前缀约定及 this.emitFile/失效处理方式。
核心关键词Vite 插件 虚拟模块 \0 空字符约定 - 0086
Vite 依赖预构建的缓存何时会失效并触发重新构建？
围绕“Vite 依赖预构建的缓存何时会失效并触发重新构建”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 lockfile 变化、config 中 optimizeDeps 相关配置变化、强制 --force 等失效条件。
核心关键词Vite 预构建缓存失效 lockfile optimizeDeps - 0087
Vite 中放在 public 目录的资源与通过 import 引入的资源在处理上有何本质区别？
围绕“Vite 中放在 public 目录的资源与通过 import 引入的资源在处理上有何本质区别”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 public 原样复制不哈希不压缩、import 资源走构建管道带哈希的判断。
核心关键词Vite public 目录 与 import 资源 区别 - 0088
Vite 的中间件模式（middleware mode）如何用于开发期 SSR，为什么开发时不需要 SSR 构建？
围绕“Vite 的中间件模式（middleware mode）如何用于开发期 SSR，为什么开发时不需要 SSR 构建”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 createServer middlewareMode 挂到自有服务器并用 ssrLoadModule 按需加载服务端模块的机。
核心关键词Vite middleware mode SSR 开发 ssrLoadModule - 0089
用 Vite 做 SSR 时，客户端入口与服务端入口如何组织，ssr build 的产物与客户端构建有何不同？
围绕“用 Vite 做 SSR 时，客户端入口与服务端入口如何组织，ssr build 的产物与客户端构建有何不同”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出双入口结构与 vite build --ssr 生成 Node 可加载产物（无资源哈希清单）的区别。
核心关键词Vite SSR 入口 ssr build 产物 - 0090
Vite SSR 中依赖为什么默认被 external 由 Node 直接加载，ssr.noExternal 什么时候需要配置？
围绕“Vite SSR 中依赖为什么默认被 external 由 Node 直接加载，ssr.noExternal 什么时”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 SSR 外置依赖减少转译开销的默认策略及对 CJS-only/含 CSS 的包需 noExternal 内联处理的判断。
核心关键词Vite SSR external noExternal - 0091
Vite 的 HMR 为什么随项目规模增大仍能保持接近常量的更新速度？
围绕“Vite 的 HMR 为什么随项目规模增大仍能保持接近常量的更新速度”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出 HMR 只失效并重取变更模块链而非重打包整图的原理，不与 webpack HMR 做全面对比。
核心关键词Vite HMR 为什么快 与项目大小无关 - 0092
Vite 开发服务器基于原生 ESM 按需编译，相比 bundle 式开发服务器解决了什么问题？
围绕“Vite 开发服务器基于原生 ESM 按需编译，相比 bundle 式开发服务器解决了什么问题”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要答出源码与依赖分离、请求级按需转译带来的冷启动和更新速度优势。
核心关键词Vite 原生 ESM 按需编译 冷启动 - 0093
Vite 为什么在开发阶段要做依赖预构建（Dep Pre-Bundling）？
围绕“Vite 为什么在开发阶段要做依赖预构建（Dep Pre-Bundling）”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖必须答出 CJS/UMD 转 ESM 与减少模块请求数这两个动机。
核心关键词Vite 依赖预构建 原因 - 0094
Webpack 5 的 asset modules 有哪几种类型，如何替代 file-loader 和 url-loader？
围绕“Webpack 5 的 asset modules 有哪几种类型，如何替代 file-loader 和 url-lo”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要对比四种 asset 类型及 dataUrl 阈值决策，不讲旧版 loader 的迁移步骤细节。
核心关键词webpack5 asset modules asset/resource asset/inline - 0095
Webpack babel-loader 的 cacheDirectory 选项如何提升二次构建速度？
围绕“Webpack babel-loader 的 cacheDirectory 选项如何提升二次构建速度”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖解释 loader 级磁盘缓存的命中条件与失效因素，不对比 webpack 5 持久化缓存。
核心关键词webpack babel-loader cacheDirectory 缓存 - 0096
Webpack 官方建议的构建性能优化手段有哪些，应按什么顺序排查？
围绕“Webpack 官方建议的构建性能优化手段有哪些，应按什么顺序排查”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖给出版本升级、缩小 resolve 范围、减少 plugin/loader 开销等优先级，不深入持久化缓存细节。
核心关键词webpack 构建性能优化手段 排查顺序 - 0097
发现 Webpack 产物体积异常增大，如何用 webpack-bundle-analyzer 定位问题？
围绕“发现 Webpack 产物体积异常增大，如何用 webpack-bundle-analyzer 定位问题”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明从产物 stats 到可视化定位重复依赖与大模块的流程，不讲瘦身手段本身。
核心关键词webpack bundle analyzer 体积分析 - 0098
如何利用 Webpack 的 contenthash 与 runtime chunk 实现稳定的长效缓存？
围绕“如何利用 Webpack 的 contenthash 与 runtime chunk 实现稳定的长效缓存”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要说明内容哈希命名与运行时代码抽离避免缓存级联失效，不讲 Service Worker 缓存。
核心关键词webpack 长效缓存 contenthash runtimeChunk - 0099
Webpack 实现代码分割有哪几种方式，各自适合什么场景？
围绕“Webpack 实现代码分割有哪几种方式，各自适合什么场景”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖需要对比入口分割、SplitChunksPlugin、动态 import 三条路径，不深入缓存组配置细节。
核心关键词webpack 代码分割 code splitting 方式 - 0100
Webpack 中 css-loader 和 style-loader 各自负责什么，为什么生产环境要换成 MiniCssExtractPlugin？
围绕“Webpack 中 css-loader 和 style-loader 各自负责什么，为什么生产环境要换成 Mini”给出直接结论、机制拆解、可复现验证、常见误区与追问，重点覆盖区分模块化解析与注入 DOM 的职责及抽离 CSS 的收益，不讲 CSS Modules 配置。
核心关键词webpack css-loader style-loader MiniCssExtractPlugin 区别