title: Register own Service Worker on Angular alongside its own worker
body: <p>I have an web application that needs to work offline. I want to create my service worker to handle the API caching/sync logic, and let the angular's service worker cache the application assets.</p>
  
  <p>I got the Angular worker to register and work perfectly. But I could not get to register my worker.</p>
  
  <p>I tried three methods:</p>
  
  <pre><code>//1. Does not seem to do anything. No worker built, no worker starter.
  ServiceWorkerModule.register('./offline.worker', {enabled: environment.production});
  
  //2. The worker does not get built, registering fails since the script does not exist.
  navigator.serviceWorker.register('./offline.worker');
  
  //3. The worker gets built, it even gets started, but is not registered as ServiceWorker.
  new Worker('./offline.worker', {type: 'module'});
  </code></pre>
  
  <p>So, option 1 works fine using the docs on the angular service worker when we point to the ngsw js file. Maybe it is simply not made to work for our workers?</p>
  
  <p>Option 2 is the documented/standard way to register service workers, maybe I should simply get my worker to be built? I do not know where to start to do that... The complete error I get is </p>
  
  <blockquote>
    <p>Uncaught (in promise) TypeError: Failed to register a ServiceWorker for scope ('<a href="http://localhost:8080/" rel="noreferrer">http://localhost:8080/</a>') with script ('<a href="http://localhost:8080/offline.worker" rel="noreferrer">http://localhost:8080/offline.worker</a>'): A bad HTTP response code (404) was received when fetching the script.</p>
  </blockquote>
  
  <p>Option 3 gets everything done as I would have expected. My worker is compiled the <code>./offline.worker</code> is even changed to the bundle created! That's really how I would have expected to get things going. Unfortunately the worker created like so is only a web worker, not a ServiceWorker. This means it does not get to handle FetchEvents...</p>
  
  <p>For sake of completeness, here is my tsconfig.worker.json</p>
  
  <pre><code>{
    "extends": "./tsconfig.json",
    "compilerOptions": {
      "outDir": "./out-tsc/worker",
      "lib": [
        "es2018",
        "webworker"
      ],
      "types": []
    },
    "include": [
      "src/**/*.worker.ts"
    ],
    "exclude": [
      "test.ts",
      "**/*.spec.ts"
    ]
  }
  </code></pre>
  
  <p>And the commands used to launch angular in production mode since service workers do not worker in develop:</p>
  
  <pre><code>ng build --prod
  http-server dist/app
  </code></pre>