Vite dev proxy 'new URL(url, import.meta.url)'

1.2k Views Asked by At

Good day!

I have recently switched from laravel-max (webpack) to laravel-vite (vite).

Web page (index.php) is served from php server and vite hmr separately for js dev server.

I wanted to convert workers by workerize-loader to web worker modules in vite. (I would like to use Typescript and imports.)

So, if you load worker as

const worker = new Worker(new URL('./worker.ts', import.meta.url), {type: 'module'})

it works fine after building. However, the problem is, that site is served (in dev) from https://localhost:8000 and new Worker(new URL('./worker.ts', import.meta.url), {type: 'module'}) resolves to 'https://localhost:5173/@fs/path-to/worker.ts?type=module&worker_file and Workers can be initiated only from same origin.

I suspect I have three solutions:

  1. Proxying in vite dev server: I could not configure out that

  2. Importing worker through fetch/axios to Blob and create a worker from the Blob. However, then the worker cannot have import statements and Typescript.

  3. (Appended) Remove vite hmr and use vite as webpack - each change compiles down to code that is requested by browser (dont know how to do with laravel-vite)

Thanks in advance!

P.S. I am using Vue 3 composition-api, if it helps

0

There are 0 best solutions below