hermes-config/skills/self-hosting/shop-pro-quote/references/nginx-mjs-mime.md

nginx: Serving .mjs Files with Correct MIME Type

Problem

pdfjs-dist uses a web worker loaded as an ES module (.mjs). The worker is referenced via Vite's new URL() pattern in src/main.tsx:

pdfjsLib.GlobalWorkerOptions.workerSrc = new URL(
  'pdfjs-dist/build/pdf.worker.min.mjs',
  import.meta.url,
).toString();

At runtime this resolves to e.g. /assets/pdf.worker.min-DEtVeC4l.mjs. Browsers refuse to load ES modules served with Content-Type: application/octet-stream — they require text/javascript or application/javascript.

nginx's default mime.types does not include .mjs, so it falls back to the default_type of application/octet-stream. This causes "Export as Images" (and any feature using pdfjs-dist) to fail with:

Failed to fetch dynamically imported module: https://grajmedia.duckdns.org/assets/pdf.worker.min-XXXX.mjs

Fix

Add a types block in /etc/nginx/nginx.conf after the include /etc/nginx/mime.types; line:

include /etc/nginx/mime.types;

# ES modules (.mjs) need text/javascript MIME type — browsers refuse
# application/octet-stream for dynamic imports.
types {
    application/javascript mjs;
}

default_type application/octet-stream;

Then reload:

sudo nginx -t && sudo nginx -s reload

Verify:

curl -sI https://grajmedia.duckdns.org/assets/pdf.worker.min-XXXX.mjs | grep -i content-type
# → Content-Type: application/javascript