Offline Access (PWA)

Methanol includes a built-in PWA implementation featuring a custom service worker and an automated precache manifest. Critical assets are cached upon installation, while remaining content is warmed in the background with revision-aware updates.

Enabling PWA

Enable PWA support in methanol.config.js:

export default () => ({
	pwa: true
})

Manifest Customization

Customize the PWA manifest and precaching strategy as follows:

export default () => ({
	pwa: {
		manifest: {
			name: 'My Site',
			short_name: 'My Site'
		},
		precache: {
			include: ['**/*.{html,js,css,ico,png,svg,webp,jpg,jpeg,gif,woff,woff2,ttf}'],
			exclude: ['**/*.map', '**/pagefind/**']
		}
	}
})

Precache configuration:

Advanced Configuration

For full control over the PWA lifecycle (e.g., custom service worker strategies), set pwa: false and supply your own manifest and service worker.

Custom Offline Page

Create pages/offline.mdx to define the fallback page displayed when a user is offline and the requested content is uncached. You may also define pages/404.mdx for "Not Found" errors; both are excluded from navigation by default.