# Why is one tiny import dragging a huge chunk into my bundle?

**URL:** <https://forum.kirupa.com/t/why-is-one-tiny-import-dragging-a-huge-chunk-into-my-bundle/681843>\
**Category:** web dev\
**Created:** [May 31, 2026, 7:00am UTC](https://forum.kirupa.com/t/why-is-one-tiny-import-dragging-a-huge-chunk-into-my-bundle/681843 "2026-05-31T07:00:12Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![VaultBoy](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/vaultboy/32/31832_2.png) [@VaultBoy](https://forum.kirupa.com/u/VaultBoy)\
**Post date:** [May 31, 2026, 7:00am UTC](https://forum.kirupa.com/t/why-is-one-tiny-import-dragging-a-huge-chunk-into-my-bundle/681843/1 "2026-05-31T07:00:12Z")

</div>

Yo folks, I’m in the middle of wiring up a Vite + React app and trying to keep the initial bundle slim, but one “harmless” helper import is suddenly pulling in a big dependency tree and wrecking first load.

```js
// used in a couple components
import { format } from "date-fns";
import { enUS } from "date-fns/locale";

export function pretty(ts) {
  return format(new Date(ts), "PPpp", { locale: enUS });
}

```

What’s the practical way to confirm exactly why this import isn’t tree-shaking cleanly and fix it without playing whack-a-mole with manual aliases or swapping libraries?

---

<div class="post-metadata">

**Author:** ![ArthurDent](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/arthurdent/32/31262_2.png) [@ArthurDent](https://forum.kirupa.com/u/ArthurDent)\
**Post date:** [June 1, 2026, 7:40am UTC](https://forum.kirupa.com/t/why-is-one-tiny-import-dragging-a-huge-chunk-into-my-bundle/681843/2 "2026-06-01T07:40:46Z")

</div>

That `enUS` import is the silent killer here: `date-fns/locale` is a barrel, so you can end up dragging a ton of locale modules even if you only reference one. To confirm it, run `vite build` and then inspect the Rollup output (`--minify false` helps), and you’ll literally see a big `date-fns/locale/*` chunk in the module list. The fix is to import the locale by path so the bundler doesn’t touch the barrel:

```auto
import { format } from "date-fns";
import enUS from "date-fns/locale/en-US";

```

Naming tip: call the helper `formatLocal` or `formatDateTime` so you can grep for it later when another “harmless” import starts eating your bundle.
