Adding PWA To Angular 8 - Module Build Failed

I have angular 8 app. Inside this app I have three projects. I want to add @angular/pwa with this command ng add @angular/pwa && ng build --prod But when PWA is installed

Solution 1:

Steps to make it working...

• npm uninstall @angular/pwa

• npm cache clean

Random errors§ Some strange issues can be resolved by simply running npm cache clean and trying again. If you are having trouble with npm install, use the -verbose option to see more details.

• after all of this ng update

This will fix this error. This error happens because some of dependency in package.json is not up-to-date and they make mess with pwa.

Solution 2:

Please be aware that adding PWA is adding this features to one of the existing projects with the command below:

ng add @angular/pwa --project *project-name*

Check the official documentation from angular for more information: https://angular.io/guide/service-worker-getting-started

Solution 3:

There might be multiple errors in your application try to add pwa again properly with

ng add @angular/pwa --project *project-name*

and then build it with

ng build --prod

here is the link for your reference - https://angular.io/guide/service-worker-getting-started

Chrome console error

you are getting that error cause u are tying to access id from an object which is not defined for that you need to handle your object properly

for ex- let id = obj.id ? obj.id : '';

Try to fix that error first and then build it. If it doesn't work then remove your node_modules and then install it again and build it.

Hope this helps :)

Solution 4:

Few thing before you install pwa to angular project. First you need to update your @angular/cli to make sure you have lastest version

npm i -g @angular/cli

Then run

ng new projectname

Then add pwa to your project

ng add @angular/pwa --project *project-name*

And run

ng build --prod