Vite预构建后依赖包体积反而变大了怎么办？

Mr-培静提问于 2026-01-30 09:37:28 阅读 80

优化

我在项目里给某个第三方库用了vite optimizeDeps预构建，结果打包后的vendor.js比之前还大200kb，这是怎么回事？

之前配置是这样的：


optimizeDeps: {
  entries: ['index.html'],
  exclude: ['vue-demi'],
  include: ['lodash'],
  // 添加了预构建配置
}

尝试过删除node_modules和dist重新构建，还是没变化。用vite inspect看依赖图发现lodash被拆成了多个独立块，但其他未预构建的库反而合并得更好。是不是预构建参数设置有问题？

构建优化构建工具

我来解答赞 10 收藏

反馈

1 条解答

轩辕红凤 Lv1

预构建导致体积变大确实可能是优化参数没配对。直接用这个配置试试：

export default {

  optimizeDeps: {

    entries: ['index.html'],

    exclude: ['vue-demi', 'lodash'], // 把lodash排除掉

    include: [], // 不要手动指定include，让Vite自己决定

  },

  build: {

    rollupOptions: {

      output: {

        manualChunks(id) {

          if (id.includes('node_modules')) {

            return 'vendor'; // 强制合并第三方库到一个chunk

          }

        },

      },

    },

  },

}

原因是你之前把 lodash 单独拎出来预构建了，结果它被拆成了小块。去掉手动指定的 include，让 Vite 自己判断哪些需要预构建，同时用 manualChunks 强制合并第三方库。

再跑一次 vite build 看看，应该能解决问题。如果还不行，可能就是那个第三方库本身的问题了，得换个库或者找作者反馈。

2026-01-30 17:03