title: Angular service worker doesn't cache assets once deployed on Github pages (sub-directory)
body: <p>I developed an Angular PWA demo application (Angular v9.1.3), implementing <code>performance</code> and <code>freshness</code> strategies.</p>
  
  <p><strong>Locally it works perfectly, even offline.</strong> But once deployed on Github pages, it is not working anymore as expected: </p>
  
  <ol>
  <li><code>performance</code> strategy keeps fetching all Requests from the network, not from the cache</li>
  <li>Once offline, the app doesn't work, as nothing seems to be cached</li>
  </ol>
  
  <p><br>I use <code>angular-cli-ghpages</code> to deploy to gh-pages with the following command (angular-pwa-boilerplate is the Repo name):</p>
  
  <pre><code>    ng deploy --base-href=/angular-pwa-boilerplate/
  </code></pre>
  
  <p><br>
  Once deployed, I adjust the <code>start_url</code> property of the web-manifest file to "/angular-pwa-boilerplate/" to reflect the subdirectory structure.</p>
  
  <p><strong>Even though the scope path seems being correct and the app is installable, the service worker does not caches the assets nor the Http Responses (while locally all is fine).</strong></p>
  
  <p>I read many articles about it, but all the fixes did not work:</p>
  
  <ol>
  <li>Use a relative path <code>./</code> for the service worker file: <br>
  <code>ServiceWorkerModule.register('./ngsw-worker.js', ...)</code></li>
  <li>Set relative values for scope and start_url in manifest file:<br>
  "scope": ".", <br>
  "start_url":" "./"</li>
  </ol>
  
  <p><br></p>
  
  <p>Here the <a href="https://pacoita.github.io/angular-pwa-boilerplate/" rel="nofollow noreferrer">DEMO</a> and <a href="https://github.com/pacoita/angular-pwa-boilerplate/tree/gh-pages" rel="nofollow noreferrer">Github Repo</a></p>
  
  <p>It seems also that there is still <a href="https://github.com/angular/angular/pull/31082" rel="nofollow noreferrer">some ongoing work</a> on this topic.</p>
  
  <hr>
  
  <p><strong>UPDATE</strong></p>
  
  <p>I noticed that if I leave <code>start_url: "/"</code> (hence without adjusting it to the base-href), Angular Service Worker and its caching strategies work like a charm also on gh-pages.</p>
  
  <p><br> However the app is no more installable:</p>
  
  <p><a href="https://i.stack.imgur.com/sTgcM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sTgcM.png" alt="enter image description here"></a></p>