通过vite中rollup打包，如何对lodash做按需打包？

Question

通过vite中rollup打包，如何对lodash做按需打包？

import {throttle} from 'lodash'
import throttle from 'lodash/throttle'

这两种写法在build时 第一种dist体积比第二种要大。都说是第一种写法是将整个lodash打包进了dist。我这里有一个疑问，rollup在build时不是会对代码做按需打包吗？ rollup的树摇不会起作用吗？ 假设整个项目只使用了一个throttle函数，也会将整个lodash打包到dist吗？

虽然lodash是 cjs规范的，我理解在编译是应该会被转换成esm。
node_modules/lodash包里每个函数都是单独文件，在node_modules/lodash/index.js里仅仅对这些文件做了集合 按理说这种分散的方式会被按需打包啊。
我在网上查了说rollup的树摇操作只能识别esm模块？

Answer 1

能否做 tree-shaking 要看lodash 的导出方式,

// index.js

export { default as throttle } from "./throttle.js"
// 如果是这样的导出,那么会启动tree-shaking , 只打包 throttle 

// index.js
export function throttle (){

}
// 如果是这样的导出,那么整个index.js 都会被打包

loadash 有 esm 版本的 lodash-es

lodash 的cjs版本使用的是 module.exports = { throttle }
这种方式不会触发 tree-shaking , 因为 esm 才是官方支持 cjs 是社区规范

Answer 2

你找的资料都是对的，可以考虑换 lodash-es