now-next-pwa

0.4.0 • Public • Published

now-next-pwa

now builder for Next.js PWA. WARNING, This project is in experimental stage. APIs and others would be changed

Getting Started

Set up project and Install builder

now init nextjs
cd nextjs

Add code for service worker registration to pages/index.js

import React, { useEffect } from 'react';
 
function Home() {
  ...
  useEffect(() => {
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker
        .register('/sw.js')
        .then(registration => {
          console.log('service worker registration successful');
        })
        .catch(err => {
          console.warn('service worker registration failed', err.message);
        });
    }
  }, []);
 
  return (
    ...
  );
}

Add manifest to components/head.js and icon resources under static

const Head = props => (
  <NextHead>
    <meta charSet="UTF-8" />
    ...
    <link rel="icon" href="/static/favicon.ico" />
    <link rel="manifest" href="/manifest.json" />
    ...
  </NextHead>
);

Configure now.json with workbox and manifest custom setting as you need

{
  "version": 2,
  "builds": [
    {
      "src": "package.json",
      "use": "now-next-pwa",
      "config": {
        "workbox": {
          "globPatterns": [],
          "globIgnores": [],
          "importScripts": [
            "libs/sw-imports.js"
          ],
          "offlineGoogleAnalytics": false
        },
        "manifest": {
          "name": "NEXT-PWA-BASIC",
          "short_name": "NEXT-PWA-BASIC",
          "icons": [
            {
              "src": "/static/icon-192x192.png",
              "sizes": "192x192",
              "type": "image/png"
            },
            {
              "src": "/static/icon-512x512.png",
              "sizes": "512x512",
              "type": "image/png"
            }
          ]
        }
      }
    }
  ]
}

Deploy to now

now

or you can test in development mode of now

now dev

License

MIT @ Jimmy Moon

Readme

Keywords

none

Package Sidebar

Install

npm i now-next-pwa

Weekly Downloads

10

Version

0.4.0

License

MIT

Unpacked Size

3.72 MB

Total Files

6

Last publish

Collaborators

  • ragingwind