title: Load web workers dynamically. Errors resolving relative imports
body: <p><strong>Context:</strong></p>
  <p>I am loading several web workers in a dynamic way by using blob-based URIs. In my problem, this strategy is required because workers' content is partially generated using a template-based solution. See (1) in code</p>
  <p><strong>Problem:</strong></p>
  <p>Web workers include <code>import</code> sentences with relative paths. As they are loaded using the <code>Worker</code> constructor and it does not allow to specify a base path, relative imports cannot be properly resolved as absolute references. As a result, the worker loading process fails with no console message (I guess a 404 error is under the hood).</p>
  <p><strong>Example:</strong></p>
  <p>In this example we have created the following set of resources:</p>
  <pre><code>index.html
  /scripts
    /helpers
       helper.x.js
       helper.y.js
    /loader
       loader.js
    /workers
       worker.x.js
  </code></pre>
  <p>We have created a dynamic loader in loader.js:</p>
  <pre><code>function Loader () {
  
    function asCode (text) { ... }
  
    async function load (path) {
      let response = await fetch (path)
      let text     = await response.text ()
      let code     = asCode (text) // (1)
      let blob     = new Blob ([code], { type: 'text/javascript' })
      let url      = URL.createObjectURL(blob)
      let worker   = new Worker (url, { type: 'module' })
      return worker
    }
  
    return { load }
  }
  
  export default Loader ()
  </code></pre>
  <p>The worker in worker.x.js imports two naive helpers X &amp; Y by using relative paths. Please, notice that if the path in import sentences where absolute (http://...) the problem described here would not appear:</p>
  <pre><code>  import X from '../helpers/helper.x.js'
    import Y from '../helpers/helper.y.js'
  
    X.fx ()
    Y.fy ()
  </code></pre>
  <p>Finally, in index.html we load the worker:</p>
  <pre><code>&lt;body&gt;
     &lt;script type=&quot;module&quot;&gt;
       import Loader from './scripts/loader/loader.js'
       let WX = Loader.load ('./scripts/workers/worker.x.js')
     &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  <p>Please, visit this <a href="https://replit.com/@javiervelezreyes/Dynamic-Web-Workers" rel="nofollow noreferrer">replit</a> to explore the project.</p>
  <p><strong>Question:</strong></p>
  <p>Is there any way to load web worker scripts in a dynamic way specifying the base path that must be used to resolve relative paths in inner import sentences? For me, an extension of the Worker constructor with a new <code>base</code> parameter like this would be perfect :)</p>
  <pre><code>let WX = new Worker (path, { type: 'module', base: 'the-base-path' })
  </code></pre>