Search code examples
reactjsprogressive-web-appscreate-react-applighthouse

React PWA : create-react-app and Chrome's Lighthouse extension

I am new to React and starting with creating a new app with boilerplate code by using create-react-app. The tool works great and I can run the simple app locally.

Next, before I proceed, I want to ensure that it is a Progressive Web App (PWA). From the latest release notes of create-react-app, looks like create-react-app creates a PWA by default.

I have been using Chrome's Lighthouse extension to create a report showing whether all aspects of PWA have been achieved. But the report created against the default app created using create-react-app doesn't check off some important aspects of PWA, here's a snapshot :

enter image description here

Any guidance of creating PWAs with create-react-app would be much appreciated.

Solution

  • Create-React-App only enables the sw-precache-plugin in the production build. This is to avoid problems with caching when developing. You create a production build by running npm run build and then following the instructions in the terminal to serve the build folder.