依赖预构建是vite在开发服务器启动前对node_modules中第三方依赖的集中处理，核心作用是将commonjs/umd包转为浏览器可执行的esm格式，并将多文件esm库（如lodash-es）打包成单文件以避免数百个http请求。
依赖预构建是 Vite 在开发服务器启动前，对 node_modules 中第三方依赖做的一次集中处理，核心作用就两个：让 CommonJS/UMD 包能在浏览器里跑起来，以及把“碎成几百个文件”的 ESM 库（比如 lodash-es）打包成单个模块，避免浏览器发几百个请求。
为什么必须预构建？
浏览器原生只认 ES 模块（import 语法），但很多包仍用 CommonJS（require()）或 UMD 格式发布。Vite 开发时又不走打包流程（no-bundle），所以得提前把这些非 ESM 依赖转成浏览器能直接执行的 ESM 代码。
预构建还顺带做了性能优化：像 lodash-es 有 600+ 个子模块，不预构建的话，import { debounce } from 'lodash-es' 会触发 600+ 个 HTTP 请求；预构建后变成一个文件，一次请求搞定。
将一个或多个视频上传至YouTube。当用户想“上传到YouTube”“发YouTube”“批量上传”“upload to YouTube”“post videos to YouTube”或发布到YouTube时使用此技能。
怎么解决 CommonJS 兼容问题？
Vite 默认用 esbuild 做预构建，它能自动解析和重写 CommonJS 的 require、module.exports 等，生成等效的 ESM 输出，并保留具名导入（比如 import React, { useState } from 'react' 能正常工作）。
- 绝大多数 CJS 包（如
lodash、axios）无需额外配置，Vite 自动识别并处理 - 如果遇到报错
Uncaught ReferenceError: require is not defined，说明某个包含未被覆盖的动态require('./xxx')或__dirname，这时要显式排除它：optimizeDeps: { exclude: ['problematic-package'] } - 对混用 CJS 和 ESM 的项目（比如同时装了
lodash和lodash-es），建议统一用 ESM 版本，或在resolve.alias中指定具体入口，避免歧义
预构建不是万能的，这些情况要手动干预
预构建只针对 node_modules 下的真实第三方包，不处理本地源码、monorepo 中链接的包（它们被视为源码），也不处理 devDependencies 中被误引入的类型包（比如 @types/node 被 tsconfig.json 的 types 字段拉进来了，会导致卡死）。
- 预构建卡在
Pre-bundling dependencies：先删node_modules/.vite/deps，加--force重试；再检查tsconfig.json的include是否太宽、types是否包含运行时无关项 - 某些包（如
electron、sqlite3）含 Node.js 特有 API，无法在浏览器运行，必须exclude，并在代码中条件判断环境 - 想跳过预构建验证是否是它导致的问题，可临时设
optimizeDeps: { disabled: true }，但仅限调试
