Test

# worker-with-import-map

> Use importmaps in a worker interface

Latest version **2.0.1** (published 2024-07-23) · MIT license · 0 weekly downloads

## Install

```sh
npm install worker-with-import-map
pnpm add worker-with-import-map
yarn add worker-with-import-map
bun add worker-with-import-map
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.1 |
| Published | 2024-07-23 |
| First published | 2024-07-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM |
| Dependencies | 2 |
| Unpacked size | 19.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | Hermann Rolfes |
| Maintainers | kungfooman |
| Keywords | Worker, with, importmap, import, map, ESM, ESM shim, polyfill |

## Links

- npm: https://www.npmjs.com/package/worker-with-import-map
- Repository: https://github.com/kungfooman/worker-with-import-map
- Issues: https://github.com/kungfooman/worker-with-import-map/issues
- npm.io page: https://npm.io/package/worker-with-import-map

## Dependencies (2)

- [web-worker](https://npm.io/package/web-worker.md) ^1.3.0
- [browser-or-node](https://npm.io/package/browser-or-node.md) ^2.1.1

## Alternatives

- [cron](https://npm.io/package/cron.md) — 4.9M weekly downloads
- [@vercel/queue](https://npm.io/package/@vercel/queue.md) — 731.6K weekly downloads
- [create-sonicjs](https://npm.io/package/create-sonicjs.md) — 1.6K weekly downloads
- [@exellix/jobs-api](https://npm.io/package/@exellix/jobs-api.md) — 941 weekly downloads
- [@forwardimpact/libskill](https://npm.io/package/@forwardimpact/libskill.md) — 575 weekly downloads

## Recent versions

- 2.0.1 (latest) — 2024-07-23
- 2.0.0 — 2024-07-23
- 1.0.4 — 2024-07-20
- 1.0.3 — 2024-07-18
- 1.0.2 — 2024-07-18
- 1.0.1 — 2024-07-18
- 1.0.0 — 2024-07-18

## README

# Install

```sh
npm i worker-with-import-map
```

# Specification

See https://github.com/WICG/import-maps/issues/2

# Two available polyfill classes

1) **WorkerWithImportMapViaInlineFrame**: Enabling [importmaps](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script/type/importmap) in [web workers](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) via [iframes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe) as workers.

2) **WorkerWithImportMapViaBedfordsShim**: Same polyfill idea, but using @guybedford's ESM shim inside a normal `Worker`.

# Usage

**test.html**

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Test</title>
    <script type="importmap">{"imports": {
        "worker-with-import-map": "./node_modules/worker-with-import-map/src/index.js"
    }}</script>
    <script type="module" src="test.js"></script>
  </head>
</html>
```

**test.js**

```js
import {Worker} from 'worker-with-import-map';
const worker = new Worker('./worker-script.js');
worker.postMessage({hello: 'ping'});
```

**worker-script.js**

```js
// Here you can import anything you want now with import map support!
import {funny} from 'one-of-your-fancy-libs';
self.onmessage = (e) => {
  const haiToo = funny('pong');
  self.postMessage({haiToo});
}
```

This works in client and server, buildless (aka no build tools like `rollup` or `Webpack` required).

Please just clone this repo and test:

 - http://127.0.0.1/worker-with-import-map/test/test.html

That will give you a better picture with non-trivial code and showing off how you can re-use your importmap too.

# Development

Just test it and report feedback, if you feel like it.

# Have?

Fun!

---
_Source: https://npm.io/package/worker-with-import-map · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._