Manifest "add to home-screen" not loading

[eeerrrttty]

After creating a vue init pwa and deploying, no 'add to home-screen' is shown on load.

Steps to reproduce:

vue init pwa firebase init (configure to a test project) firebase deploy enter the url displayed

[amaralDaniel]

Same issue here. Does anyone know if Firebase needs to have a proper configuration to work with SW?

[brunosc]

Same issue here. I create a new project and when run it, the prompt to install don't appear

[africlouds]

Same here. Furthermore, the app scores 55% in lighthouse

failure does not register a service worker manifest start_url not cached by a service worker

[amaralDaniel]

My score is 100% in production, however there isn't a prompt to install. This prompt is suggested by the browser based on an heuristic. I don't know if that is the problem because I've tested on another person phone and it still doesn't show up.

[eeerrrttty]

Im here with 91% score in productin in audits. But really. Why doesn't the pop-up appear and how i will do ti? This is a crictical point.

[amaralDaniel]

Maybe this will help you.

[valentinlourteau]

U can trigger the prompt

window.addEventListener('beforeinstallprompt', function(event) {
    console.log("before install prompt")
    event.prompt();
  })

Not sure from where i get this but if it may be usefull

[eeerrrttty]

So, where do i put this code? I putted it after log in, nothing happened

[bdaley]

I'm getting the same error as @africlouds on both dev and prod environments. While manually triggering the prompt seems like an appropriate workaround, it worries me that Chrome/Lighthouse doesn't recognize my app as a PWA. It makes me think that this might just be a symptom of a larger problem.

With that said, it appears that we'll need some boilerplate code which triggers the prompt anyway. Chrome 68 will no longer trigger the prompt automatically.

https://developers.google.com/web/fundamentals/app-install-banners/

[eeerrrttty]

shouldn't this 'manual trigger' be included in the core code of pwa? Because i think all developers would like this.

[nacimgoura]

Same problem, I can't get the prompt to appear. You have to edit registerServiceWorker.js?

[vesper8]

this should either be built-in or a vue-pwa-install-prompt project should be created to shed light on this mystery!! we all need this!

btw auditing with lighthouse also said that my app doesn't register a service worker.. which sounds like blasphemy to me!

[cathyhax]

I ran into this issue as well, but realized it's because I edited out this line below from the index.html file: <%= htmlWebpackPlugin.options.serviceWorkerLoader %>

This line activates the service worker.

[jgalentine007]

I'm also trying to figure this out - out of the box service work registers and shows in chrome (both in sources and ://inspect/#service-workers) - I get an error in lighthouse that no usuable web app manifest was found (but it is served.) The error shows that url as /#/ - I wonder if this a problem with vue routing, I remember seeing somewhere in a tutorial how to hide /#/ from the URL.

[jgalentine007]

I think changing the router mode to 'history' has solved the issue for me, lighthouse passes and workbox events show up in console!

Edit: I think the real problem is Azure App Service by default doesn't serve .json files, adding MIME type fixes.