razzle-plugin-pwa
v2.2.3
Published
Create Progressive Web App with Razzle
Readme
razzle-plugin-pwa
A Razzle 2.x plugin for generating configuraable progressive web applications and web application manifests.
Usage
Example options for each plugin can be found inside of testdata. Once you have your desired options, pass it to modify which will return a Razzle plugin compliant modify function. It just works.
// razzle.config.js
const modifyBuilder = require('razzle-plugin-pwa').default
const pwaConfig = {
swDest: 'sw.js',
clientsClaim: true,
skipWaiting: true,
runtimeCaching: [{
urlPattern: new RegExp('https://www.mysite.co'),
handler: 'networkFirst'
}]
}
const manifestConfig = {
filename: 'manifest.json',
name: 'Razzle App',
short_name: 'Razzle',
description: 'Another Razzle App',
orientation: 'portrait',
display: 'fullscreen',
start_url: '.',
theme_color: '#ffffff',
background_color: '#ffffff',
related_applications: [],
icons: [
{
'src': require.resolve(path.join(__dirname, 'public', 'favicon-16x16.png')),
'sizes': '16x16',
'type': 'image/png'
},
{
'src': require.resolve(path.join(__dirname, 'public', 'favicon-32x32.png')),
'sizes': '32x32',
'type': 'image/png'
},
{
'src': require.resolve(path.join(__dirname, 'public', 'favicon-144x144.png')),
'sizes': '144x144',
'type': 'image/png'
},
{
'src': require.resolve(path.join(__dirname,'public', 'android-chrome-192x192.png')),
'sizes': '192x192',
'type': 'image/png'
},
{
'src': require.resolve(path.join(__dirname, 'public', 'android-chrome-512x512.png')),
'sizes': '512x512',
'type': 'image/png'
}
]
}
const modify = modifyBuilder({ pwaConfig, manifestConfig })
module.exports = {
plugins: [{ func: modify }]
}Configuration options
All available configuration options are defined in their respective repositories:
