Adding a Manifest File
If you’ve run an audit with Lighthouse, you may have noticed a lackluster score in the “Progressive Web App” category. Let’s address how you can improve that score.
But first, what exactly are PWAs?
They are regular websites that take advantage of modern browser functionality to augment the web experience with app-like features and benefits. Check out Google’s overview of what defines a PWA experience and the Progressive web apps (PWAs) doc to learn how a Gatsby site is a progressive web app.
The inclusion of a web app manifest is one of the three generally accepted baseline requirements for a PWA.
The web app manifest is a simple JSON file that tells the browser about your web application and how it should behave when ‘installed’ on the user’s mobile device or desktop.
Gatsby’s manifest plugin configures Gatsby to create a
manifest.webmanifest file on every site build.
- Install the plugin:
Add a favicon for your app under
src/images/icon.png. The icon is necessary to build all images for the manifest. For more information look at the docs of
Add the plugin to the
pluginsarray in your
That’s all you need to get started with adding a web manifest to a Gatsby site. The example given reflects a base configuration — check out the plugin reference for more options.