Blank Page with PWA and NGINX

[phgrund]

Whenever I deploy my PWA and try to access in production, it gives me a blank screen and the following error in console

In PWA options in quasar.conf.js file I have the following options:

The NGINX configuration files is the same as the one used in the Deploying SPA Guide

For what I’ve realized, this vendor(…).js file is missing since quasar has been built again, any ideias on how to fix it?

[dobbel]

@phgrund

does a SPA build deploy without issues?

[turigeza]

@phgrund
MIME type missmatch is the problem you can see it in the console.

add_header X-Content-Type-Options nosniff;
seems causing issues for some.
https://stackoverflow.com/questions/29573489/nginx-failing-to-load-css-and-js-files-mime-type-error

Commenting it out should help as suggested there.

[phgrund]

@dobbel never tried, since I need a PWA to generate the APK

[phgrund]

@turigeza will it bring some security issues or its safe to remove?

[dobbel]

@phgrund

PWA has nothing to do with APK. So question remains DOES it deploy correctly as SPA?

[phgrund]

@dobbel turns out i figured out what was the problem. It was missing the publicPath in the webpack config. So adding the production URL stopped these missing vendor.js files problem. I still remain with one problem which is sometimes if I open my PWA offline (which I accessed before) it doesnt show the cached version, just a white screen, but sometimes it shows. Any solutions? My workbox options are in the first post

[dobbel]

@phgrund

I still remain with one problem which is sometimes if I open my PWA offline

white screen usually occurs when you are using ie11 or an older android <7 webview.

But I guess you are experiencing this blank screen in chrome?

sometimes …

Without any other info it’s like finding a needle in a haystack. You will have to investigate when this happens, and when not. For example:

1. it only happens the first time you view it offline.
2. it only happens on chrome and not firefox ( yes some people have had issues with PWA’s on chrome lately)
3. errors in the console when it happens.
4. ect…

btw I have had zero issues with workbox 4.x and PWA’s

If you have an url or the pwa I could check it out.