Angular to load js file with loader 'file'

Angular when used with esbuild supports specifying loaders via import attributes. For example something like this:

import userImageURL from 'user.svg' with { loader: 'file' };


This works because of angular-loader-import-attributes provided plugin.

I have a couple of libraries that require web worker urls provided and therefore I try to import it with the same logic:

import imageCompressionWorkerURL from 'browser-image-compression/dist/browser-image-compression.js' with { loader: 'file' };


But I always endup with having default import instead of file URL. What am I doing wron here? Yes I know I can construct a worker like this:

const worker = new SharedWorker(new URL('some-worker', import.meta.url), { type: 'module' });


And it will work. But this is not what the library wants. It just needs an URL. Currently I simply copy the file to output as an asset and provide fixed url. But this has cache issues and I want it content-hashed.

Continue reading...