# esbuild-auto-path-plugin

> Plugin for transforming bundles to use an auto path for assets.

Latest version **1.4.0** (published 2026-03-18) · MIT license · 0 weekly downloads

## Install

```sh
npm install esbuild-auto-path-plugin
pnpm add esbuild-auto-path-plugin
yarn add esbuild-auto-path-plugin
bun add esbuild-auto-path-plugin
```

## Health

**Score 70/100 (B)** — status: stable.

Positive: has types; esm support; no vulnerabilities; has provenance; high maintenance score; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 1.4.0 |
| Published | 2026-03-18 |
| First published | 2023-01-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=16.0 |
| Dependencies | 0 |
| Unpacked size | 19.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 2 |
| Author | smapiot |
| Maintainers | florianrappl |
| Keywords | plugin, esbuild, build, microfrontend |

## Links

- npm: https://www.npmjs.com/package/esbuild-auto-path-plugin
- Repository: https://github.com/smapiot/piral-cli-esbuild
- Homepage: https://piral.io
- Issues: https://github.com/smapiot/piral-cli-esbuild/issues
- Funding: https://github.com/sponsors/smapiot
- npm.io page: https://npm.io/package/esbuild-auto-path-plugin

## Alternatives

- [raw-loader](https://npm.io/package/raw-loader.md) — 4.3M weekly downloads
- [plop](https://npm.io/package/plop.md) — 1.4M weekly downloads
- [webpack-deadcode-plugin](https://npm.io/package/webpack-deadcode-plugin.md) — 80.3K weekly downloads
- [@storybook/preact-vite](https://npm.io/package/@storybook/preact-vite.md) — 54.2K weekly downloads
- [vite-plugin-transform](https://npm.io/package/vite-plugin-transform.md) — 2.4K weekly downloads

## Recent versions

- 1.4.0 (latest) — 2026-03-18
- 1.3.0-beta.0fe3852 (next) — 2026-03-18
- 1.3.0 — 2025-06-23
- 1.3.0-beta.8144 — 2025-06-23
- 1.2.2 — 2025-03-19
- 1.2.1 — 2025-01-26
- 1.2.0 — 2024-12-26
- 1.2.0-beta.7700 — 2024-12-26
- 1.2.0-beta.7680 — 2024-12-26
- 1.2.0-beta.7675 — 2024-12-25
- 1.1.0 — 2024-12-07
- 1.1.0-beta.7623 — 2024-12-07
- 1.0.1 — 2023-11-19
- 1.0.1-beta.6244 — 2023-11-19
- 1.0.0 — 2023-07-05
- … 6 more at https://npm.io/package/esbuild-auto-path-plugin/versions

## README

# `esbuild-auto-path-plugin`

A plugin for `esbuild` to allow referencing files relative to the path of the JavaSCript. This can be useful to work in a micro frontend setup where the individual files of one micro frontend are served from a different path than the other micro frontends, i.e., no common public path can be determined.

## Usage

Install the plugin:

```sh
npm i esbuild-auto-path-plugin --save-dev
```

Now in your `esbuild` configuration file you can do:

```js
const { build } = require('esbuild');
const { autoPathPlugin } = require('esbuild-auto-path-plugin');

build({
  // ...
  plugins: [autoPathPlugin()],
});
```

At this point you can reference an asset file (e.g., `.jpg`) in any file, e.g., in a TypeScript asset

```js
import someImage from './my.jpg';
```

The reference to the generated asset file will be done via the automatically (i.e., at runtime) determined path.

### File Extensions

This plugin takes all extensions mapped to the `file` type in your esbuild configuration. However, you can also use the plugin to generate you this list of files. By default (i.e., if you don't specify any option and have not introduced any custom loader mapping) the following extensions will be mapped:

- `.png`
- `.svg`
- `.jpg`
- `.jpeg`
- `.webp`
- `.mp4`
- `.mp3`
- `.ogg`
- `.wav`
- `.ogv`
- `.wasm`
- `.gif`

To override this list you can just pass in the extensions like this:

```js
const { build } = require('esbuild');
const { autoPathPlugin } = require('esbuild-auto-path-plugin');

build({
  plugins: [autoPathPlugin({
    defaultExtensions: [".png", ".mov", ".woff"]
  })],
});
```

## License

This plugin is released using the MIT license. For more information see the [LICENSE file](LICENSE).

---
_Source: https://npm.io/package/esbuild-auto-path-plugin · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._