# lodash-imports-updater

> A script for JSCodeShift that updates JS files to use lighter lodash imports and reduce the bundle's size

Latest version **1.0.0** (published 2021-01-06) · Apache 2.0 license · 0 weekly downloads

## Install

```sh
npm install lodash-imports-updater
pnpm add lodash-imports-updater
yarn add lodash-imports-updater
bun add lodash-imports-updater
```

Provides the command `update-lodash-imports`.

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2021-01-06 |
| First published | 2021-01-06 |
| Weekly downloads | 0 |
| License | Apache 2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 4 |
| Unpacked size | 42.5 KB |
| Known vulnerabilities | 0 (+5 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Cyprien Quilici |
| Maintainers | quilicicf |
| Keywords | jscodeshift, lodash |

## Links

- npm: https://www.npmjs.com/package/lodash-imports-updater
- Repository: https://github.com/quilicicf/LodashImportUpdater
- Homepage: https://github.com/quilicicf/LodashImportUpdater#readme
- Issues: https://github.com/quilicicf/LodashImportUpdater/issues
- npm.io page: https://npm.io/package/lodash-imports-updater

## Dependencies (4)

- [lodash](https://npm.io/package/lodash.md) 4.17.20
- [fast-glob](https://npm.io/package/fast-glob.md) 3.2.4
- [find-root](https://npm.io/package/find-root.md) 1.1.0
- [cli-progress](https://npm.io/package/cli-progress.md) 3.8.2

## Alternatives

- [lodash.assign](https://npm.io/package/lodash.assign.md) — 2.3M weekly downloads
- [lodash.chunk](https://npm.io/package/lodash.chunk.md) — 1.8M weekly downloads
- [react-native-ios-utilities](https://npm.io/package/react-native-ios-utilities.md) — 138.5K weekly downloads
- [@technically/lodash](https://npm.io/package/@technically/lodash.md) — 50.9K weekly downloads
- [@fluid-topics/ft-icon](https://npm.io/package/@fluid-topics/ft-icon.md) — 20.6K weekly downloads

## Recent versions

- 1.0.0 (latest) — 2021-01-06

## README

# LodashImportUpdater

> A script that updates JS files to use lighter lodash imports and reduce the bundle's size

<!-- TOC START -->

* [What it does](#what-it-does)
* [How to use it](#how-to-use-it)
* [How it does its thing](#how-it-does-its-thing)
* [Bundle size improvement](#bundle-size-improvement)
* [Support](#support)

<!-- TOC END -->

## What it does

It changes default lodash imports like:

```js
import _ from 'lodash';

_.map(array, mapper);

_(array)
  .filter(predicate)
  .map(transformer)
  .value();
```

To method imports like:

```js
import filter from 'lodash/filter';
import flow from 'lodash/flow';
import map from 'lodash/map';

map(array, mapper);

flow([
  (_) => filter(_, predicate),
  (_) => map(_, predicate),
])(array);
```

This allows tree-shaking to work efficiently and to shave off a good part of lodash from your app bundle, read [this article](https://www.blazemeter.com/blog/the-correct-way-to-import-lodash-libraries-a-benchmark) for more details.

A more complete example of what is supported is available in [the examples](./examples).

> :information_source: If you spot a code pattern where the lodash import is not updated, please either submit a PR or open an issue with a base snippet of code that shows the problematic code pattern.

## How to use it

```shell
npm install --global lodash-import-updater
update-lodash-imports "$GLOB_FOR_YOUR_SOURCE_CODE"
```

The glob is interpreted by [fast-glob](https://www.npmjs.com/package/fast-glob) if quoted, by your shell if not. This has impacts on how `**` is interpreted.

In your shell, `**` probably strictly means one folder of any name in the current location, this means that `update-lodash-imports folder/**/*.js` matches `folder/whatever/file.js` but not `folder/whatever.js` or `folder/subfolder/subsubfolder/whatever.js`.

With `fast-glob`, `**` means any directory recursively. This means that `update-lodash-imports 'folder/**/*/js'` matches all the following files `folder/whatever/file.js`, `folder/whatever.js`, and `folder/subfolder/subsubfolder/whatever.js`.

For more information on how the globs work, search for documentation on your shell's globbing system. For `fast-glob`, [the documentation is here](https://www.npmjs.com/package/fast-glob#pattern-syntax).

__:warning: Beware__ the transformed code probably won't follow your formatter/linter's rules. You should re-apply them afterwards with your usual tools (ex: `npx eslint --fix .`).

Example:

```shell
update-lodash-imports 'src/**/*.js'
```

## How it does its thing

It uses [JSCodeshift](https://github.com/facebook/jscodeshift) to parse your code to an AST, then applies a transformation and re-generates the source code from the new AST.

## Bundle size improvement

|                      | Legacy imports                                               | Method imports                                                |
| -------------------- | ------------------------------------------------------------ | ------------------------------------------------------------- |
| Without tree shaking | <!-- 🔁: minifiedInputSize -->`94.1 Kb`<!-- 🔁 -->           | <!-- 🔁: minifiedOutputSize -->`61.8 Kb`<!-- 🔁 -->           |
| With tree shaking    | <!-- 🔁: minifiedInputSizeTreeShaken -->`92.4 Kb`<!-- 🔁 --> | <!-- 🔁: minifiedOutputSizeTreeShaken -->`24.0 Kb`<!-- 🔁 --> |

## Support

This tool has been written with minimal effort, this means that no effort went into building a comprehensive test suite or checking compatibility for use in other OSes than the author's.

This tool therefore should work seamlessly on UNIX systems but there is no guarantee that it works on Windows.

PRs are welcome if someone intends to fix this.

---
_Source: https://npm.io/package/lodash-imports-updater · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._