当项目逐渐变大，或需要考虑加载速度的问题时，就会考虑到分包问题。

一般来说，项目中的代码可分为业务代码和第三方库，常常会变化的都是业务代码部分，而非第三方库的代码，所以在项目更新的时候，每次都全量更新对于运维部署和客户使用来说都造成了不必要的浪费。

我们都知道，在打包的时候，vite会将我们的代码合并到几个文件中，并以name-hash名字进行命名，一般来说代码没更新时，hash值也不会变，那么我们的思路就是：将不经常变的第三方库代码打包到一个文件中，项目的业务代码打包到一个文件中，从而实现部分更新。

rollup配置

因为vite的底层还是使用的Rollup，所以查阅rollup的文档，通过output.manualChunks可实现自定义的chunk。

配置选项 | Rollup 中文文档

简单模式

javascript
  build: {
    rollupOptions: {
      output: {
        manualChunks: {
          lodash: ['lodash']
        }
      }
    }
  }

当配置成上述格式时，则会将value数组中所有的第三方包全部放到一个lodash的chunk 中。

配置前：

配置后：

以上是配置前后的打包结果对比，可以发现我们指定的第三方库的代码都打包到了一个chunk中，而且业务代码的变更并不会引起lodash的chunk的变化。

函数模式

简单模式虽然简单，但是如果一个项目的第三方库很多，那么配置在一个数组里面也不现实，所以这个时候需要使用函数模式，我们已知所有的依赖都会存在于node_modules文件夹中，所以，可以利用这个特性来完成。

javascript
  build: {
    rollupOptions: {
      output: {
        manualChunks: (id) => {
          if (id.includes('node_modules')) {
            return 'vendor'
          }
          return undefined
        }
      }
    }
  }

通过这种方式，所有的第三方库都会打包放在vendor的chunk中.