Vue.js 不负责 chunk 加载，实际由 Webpack 或 Vite 等构建工具处理动态导入、代码分割与网络请求；Vue 编译器仅解析 SFC，运行时仅协调 Promise 并封装异步组件逻辑。
Vue.js 本身不负责 chunk 的加载逻辑，真正处理动态导入（import()）并生成、加载 chunk 的是构建工具——主要是 Webpack 或 Vite。Vue 编译器（如 Vue 3 的 @vue/compiler-sfc）只负责将单文件组件（.vue）解析为渲染函数或模块导出，它不介入代码分割或网络请求过程。
构建工具才是 chunk 加载的执行主体
当你写 () => import('./MyComponent.vue')，Vue 编译器不会运行这段代码，也不会决定何时下载文件。它只是把该表达式原样保留在生成的 JavaScript 模块中。真正的行为由以下环节完成：
-
打包阶段：Webpack/Vite 静态分析
import()调用，识别出需拆分的模块，生成独立的异步 chunk（如MyComponent.[hash].js），并记录其资源路径和依赖关系 -
运行时阶段：浏览器执行到该函数时，调用原生
import()，触发 HTTP 请求加载对应 chunk；加载成功后，ES 模块系统自动执行并导出默认组件对象 - Vue 运行时接管：Vue 收到这个 Promise（返回组件定义的对象），在内部等待 resolve 后将其注册为可渲染的异步组件，期间可显示 loading 状态或 fallback 内容
chunk 名称与分组由构建配置驱动
chunk 的命名、合并与加载时机，完全取决于构建工具的配置，而非 Vue 自身：
-
/* webpackChunkName: "user" */是 Webpack 特有注释，Vite 中可用/* viteIgnore */或插件适配，但核心逻辑一致：告诉打包器“把这些import()归入同一 chunk” - 多个同名
webpackChunkName的动态导入会被打包进同一个文件，减少请求数；没标注则按文件路径自动生成唯一 chunk ID - Vite 在开发模式下直接以 HTTP 请求方式按需加载源码（无需打包），生产构建才生成实际 chunk 文件
Vue 运行时仅做 Promise 协调，不干预底层加载
Vue 对异步组件的封装（如 defineAsyncComponent）本质是语法糖，它只做三件事：
使用 `@ainative/vue-sdk` 为 Vue 3 应用添加 AI 聊天功能。适用于以下场景：(1) 安装 `@ainative/vue-sdk`，(2) 在 Vue 组件中使用 `useChat` 组合式函数，(3) 提供……
立即学习“前端免费学习笔记（深入）”；
- 包装 Promise，统一处理加载、错误、超时等状态
- 缓存已 resolve 的组件构造函数，避免重复请求
- 配合
<component :is>或路由component字段，实现异步挂载和卸载
它不发起 fetch、不插入 <script> 标签、不管理 chunk 缓存策略——这些均由构建工具生成的 runtime 代码（如 Webpack 的 __webpack_require__.e）或浏览器原生模块加载器完成。
预加载与 prefetch 是构建工具附加能力
像 <link rel="prefetch"> 这类优化，也不是 Vue 写的。Webpack 通过 /* webpackPrefetch: true */ 注释，在构建时自动注入预加载标记；Vite 则在构建产物中生成 manifest.json 并由其 runtime 控制 prefetch 行为。Vue 只提供钩子（如路由守卫中的 beforeEach），让你有机会主动调用 import() 提前触发加载。
