The bundler generates a "rogue" "export default Fl();" if I import nostr-tools in entry point

[Giszmo]

Describe the bug

In src/service-worker.ts I have the sole line:

import { relayPool } from 'nostr-tools'

but the bundle (build/service-worker.js) contains:

export default Fl();

The same happens if I import nostr from 'nostr-tools' (or probably anything other nostr-tools.

My bundle is free of exports when importing Dexie from 'dexie' or a bunch of other imports.

I tried to figure out in the vite discord if this "transient" export might be a feature of sorts but I'm more and more convinced it is a bug in the bundler.

This bug was originally reported here.

Reproduction

https://github.com/Giszmo/tmpForBugReport is a blank svelteKit project with the added dependency nostr-tools and src/service-worker.ts` consisting of only an import from that dependency.

System Info

$ npx envinfo --system --npmPackages '{vite,@vitejs/*}' --binaries --browsers

  System:
    OS: Linux 5.10 Debian GNU/Linux 11 (bullseye) 11 (bullseye)
    CPU: (24) x64 AMD Ryzen 9 3900X 12-Core Processor
    Memory: 18.77 GB / 31.33 GB
    Container: Yes
    Shell: 5.1.4 - /bin/bash
  Binaries:
    Node: 18.6.0 - ~/.nvm/versions/node/v18.6.0/bin/node
    npm: 8.13.2 - ~/.nvm/versions/node/v18.6.0/bin/npm
  Browsers:
    Chromium: 103.0.5060.53
    Firefox: 96.0.3
  npmPackages:
    vite: ^3.0.0 => 3.0.4

Used Package Manager

npm

Logs

$ npm run build && npm run preview
... (no errors)

Chromium dev console:

Uncaught SyntaxError: Unexpected token 'export' (at service-worker.js:6207:1)

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[sapphi-red]

Running the reproduction on stackblitz, there isn't any build/service-worker.js nor .svelte-kit/build/service-worker.js.

[github-actions]

Hello @Giszmo. Please provide a minimal reproduction using a GitHub repository or StackBlitz. Issues marked with need reproduction will be closed if they have no activity within 3 days.

[Giszmo]

Are you sure this is not a problem with StackBlitz cause it wouldn't build the service-workers? It runs dev mode which won't do service-workers as per sveltejs/kit#5479

[sapphi-red]

I've ran it on my local but there isn't any. So I'm sure this is not a problem with stackblitz.

[Giszmo]

$ podman run -it --rm node bash
root@be77cba517c6:/# git clone https://github.com/Giszmo/tmpForBugReport
Cloning into 'tmpForBugReport'...
remote: Enumerating objects: 37, done.
remote: Counting objects: 100% (37/37), done.
remote: Compressing objects: 100% (34/34), done.
remote: Total 37 (delta 0), reused 37 (delta 0), pack-reused 0
Receiving objects: 100% (37/37), 520.00 KiB | 285.00 KiB/s, done.
root@be77cba517c6:/# cd tmpForBugReport/
root@be77cba517c6:/tmpForBugReport# npm install
...
root@be77cba517c6:/tmpForBugReport# npm run build
...
transforming (58) node_modules/util-deprecate/browser.jsNon-existent export 'default' is imported from node_modules/nostr-tools/index.js
✓ 169 modules transformed.
.svelte-kit/output/client/service-worker.js   217.57 KiB / gzip: 48.16 KiB
...
root@be77cba517c6:/tmpForBugReport# grep "export " .svelte-kit/output/client/service-worker.js
export default ru();

[Giszmo]

If you are not familiar with podman, docker should work with the same syntax.

[sapphi-red]

Ok. So you mean .svelte-kit/output/client/service-worker.js, not build/service-worker.js.

It seems svelte-kit builds service worker to ESM format.
https://github.com/sveltejs/kit/blob/e20425fefcfe570dc678d42f61d7e13483672fc0/packages/kit/src/exports/vite/build/build_service_worker.js#L72
It is expected that ESM syntax are used in output.

The error is happening because you're importing ESM service worker with navigator.serviceWorker.register('/service-worker.js').
This needs to be navigator.serviceWorker.register('/service-worker.js', { type: 'module' });.
But it seems this code is also generated by svelte-kit.

I don't know much about svelte-kit's internals but I think there isn't a bug in Vite here.
Feel free to comment here or create a new issue if it turns out a bug in Vite.

[userquin]

@sapphi-red FYI:

What we do in pwa plugin is this:
https://github.com/antfu/vite-plugin-pwa/blob/main/src/modules.ts#L108

On dev with plugin dev enabled, we need the type module when registering the sw and delegates sw build to Vite when using custom sw:
https://github.com/antfu/vite-plugin-pwa/blob/main/src/plugins/dev.ts#L108

Otherwise we fallback to workbox-build.

I think the problem is that kit will never build the sw, current/latest and previous versions: talking with Ben, Rich always reject to include workbox-build and so ppl should use importScripts.

[userquin]

@sapphi-red you can also check my summary in kit issue

[benmccann]

I do think there's an issue in Vite here because I wouldn't expect the output to contain any export statement. See this reproduction: #15379

We can workaround it on the SvelteKit side by changing the output format to iife, but I still filed the issue here because it would be slightly smaller output that's slightly nicer to read if this wasn't necessary and it might be able to make the output smaller in other situations to remove any unneccessary export statements