vite生产构建中代码分块默认启用，需通过动态import()、manualchunks配置、sourcemap与压缩优化、common chunk精简及最小chunk大小限制来主动控制分块策略。

在 Vite 生产构建中，代码分块（Code Splitting）默认已由 Rollup（Vite 底层打包器）自动处理，但要真正优化分块效果、减小首屏体积、提升加载性能，需主动配置和干预。关键不在于“开启分块”，而在于“控制分块逻辑”和“引导分块策略”。

利用动态 import() 显式定义分割点

Vite 会将 import() 表达式自动转为异步加载的 chunk，这是最直接、最可控的分块方式。适合路由、条件性功能、大型第三方库等场景。

• 路由级分块（配合 Vue Router 或 React Router）：
  const Home = () => import('./views/Home.vue') → 生成独立 Home.***.js
• 按需加载重型依赖：
  const { parse } = await import('papaparse') → papaparse 不会打进主包
• 避免写成 import * as xxx from 'xxx' 静态导入，否则会被打入主 chunk

配置 build.rollupOptions.output.manualChunks

用于对 node_modules 中的模块进行自定义归组，解决“多个页面共用同一库却各自打包”的冗余问题。

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

• 把高频共用库（如 vue、lodash-es、axios）抽成单独 vendor chunk：
  

  manualChunks: {
        vendor: ['vue', 'vue-router', 'pinia', 'axios'],
        lodash: ['lodash-es'],
      }

• 按包大小阈值合并小模块（防止 chunk 过碎）：
  可结合 getManualChunk 函数，统计模块路径和大小后归类
• 注意：不要把业务模块写进 manualChunks，它只适用于 node_modules 或明确共享的工具库

启用 build.sourcemap: false 和 build.minify: 'terser'

虽然不直接改变分块结构，但影响最终 chunk 体积与加载效率：

• sourcemap: false（生产环境默认）→ 避免生成额外 .js.map 文件，减少请求数和部署体积
• minify: 'terser' → 比 esbuild 默认压缩更激进（支持 mangling、dead-code elimination），尤其利于多 chunk 场景下的重复代码消除
• 可进一步配 terserOptions.compress.drop_console: true 移除 console（需确认是否合规）

检查并精简 common chunk 的生成逻辑

Vite/Rollup 默认会提取被 ≥2 个入口引用的模块为 common chunk。有时这反而导致“本该专属的组件被拉进 common”，稀释了缓存优势。

• 查看构建产物中的 dist/assets/ 目录，用 vite-bundle-visualizer 插件分析 chunk 构成
• 若发现某个业务组件意外出现在 common-***.js，可加 /* @__PURE__ */ 注释或改用动态 import 隔离
• 设置 build.rollupOptions.output.experimentalMinChunkSize（Vite ≥5.2）限制最小 chunk 大小，避免过小 chunk 被拆出

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南