@optimize-lodash/rollup-plugin weekly downloads statistics

Optimize lodash imports with Rollup.js

There are multiple issues surrounding tree-shaking of lodash. Minifiers, even with dead-code elimination, cannot currently solve this problem. Check out the test showing this plugin can reduce bundle size by 70% for an example input (and that's with a minifier enabled!). With this plugin, bundled code output will only include the specific lodash methods your code requires.

There is also an option to use lodash-es for projects which ship ESM: transform all your lodash imports to use lodash-es which is tree-shakable.

Version 6.x introduces a new feature: imports of "modularized" lodash packages, such as lodash.camelcase are rewritten to use optimized imports of lodash or lodash-es. This can significantly reduce bundle size when using third-party dependencies that require these modularized imports: you no longer have to ship copies of the same lodash functions simply because one comes from lodash and another from lodash.camelcase. Applying this to kebabCase saves ~3.5kB after minification.

This input

import { isNil, isString } from "lodash";
import { padStart as padStartFp } from "lodash/fp";
import kebabCase from "lodash.kebabcase";

Becomes this output

import isNil from "lodash/isNil.js";
import isString from "lodash/isString.js";
import padStartFp from "lodash/fp/padStart.js";
import kebabCase from "lodash/kebabCase.js";

useLodashEs for ES Module Output

While lodash-es is not usable in CommonJS modules, some projects only need ESM output or build both CommonJS and ESM outputs.

In these cases, you can optimize by transforming lodash imports to lodash-es imports:

Your source input

import { isNil } from "lodash";
import kebabCase from "lodash.kebabcase";

CommonJS output

import isNil from "lodash/isNil.js";
import kebabCase from "lodash/kebabCase.js";

ES output (with useLodashEs: true)

import { isNil } from "lodash-es";
import { kebabCase } from "lodash-es";

Individual lodash.* Method Packages

Imports from individual lodash method packages like lodash.isnil or lodash.flattendeep are transformed to use the optimized import path of lodash or lodash-es, consolidating your lodash usage to a single, tree-shakable ESM package.

Your source input

import isNil from "lodash.isnil";
import flattenDeep from "lodash.flattendeep";

CommonJS output

import isNil from "lodash/isNil.js";
import flattenDeep from "lodash/flattenDeep.js";

ES output (with useLodashEs: true)

import { isNil } from "lodash-es";
import { flattenDeep } from "lodash-es";

Aliased local names are supported (import checkNull from "lodash.isnil" becomes import checkNull from "lodash/isNil.js").

Usage

import { optimizeLodashImports } from "@optimize-lodash/rollup-plugin";

export default {
  input: "src/index.js",
  output: {
    dir: "dist",
    format: "cjs",
  },
  plugins: [optimizeLodashImports()],
};

Options

Configuration can be passed to the plugin as an object with the following keys:

exclude

Type: String | Array[...String]<br> Default: null

A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should ignore. By default no files are ignored.

include

Type: String | Array[...String]<br> Default: null

A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should operate on. By default all files are targeted.

useLodashEs

Type: boolean<br> Default: false

If true, the plugin will rewrite lodash imports to use lodash-es.…