Skip to content
manovaspace docs

@manovaspace/pwa

Helpers for Next.js PWAs: web app manifest metadata, theme colors, Serwist config wrapping, and a production-oriented SerwistShell provider.

Install

Section titled “Install”
Terminal window
pnpm add @manovaspace/pwa

Peers: next, react, react-dom. Also works with npm or yarn.

Quick start

Section titled “Quick start”

next.config.ts

import { withSerwist } from "@manovaspace/pwa/next";


export default withSerwist({
  transpilePackages: ["@manovaspace/pwa"],
});

Service worker entry — point Serwist at the default SW (or your own):

// typically wired via withSerwist / serwist config using:
import "@manovaspace/pwa/sw";

See the package’s withSerwist wrapper and your Next.js version’s Serwist docs for the exact swSrc / output path your app uses.

app/manifest.ts

import { defineWebAppManifest } from "@manovaspace/pwa";


export default defineWebAppManifest({
  name: "My App",
  shortName: "App",
  startUrl: "/",
  themeColors: { light: "#ffffff", dark: "#0a0a0a" },
});

app/layout.tsx

import { SerwistShell } from "@manovaspace/pwa/react";


export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        <SerwistShell>{children}</SerwistShell>
      </body>
    </html>
  );
}

SerwistShell is intended for production PWA registration patterns — keep offline/SW behavior tested before shipping.

Subpath exports

Section titled “Subpath exports”
Import Purpose
@manovaspace/pwa Manifest helpers and color types
@manovaspace/pwa/next withSerwist Next.js config wrapper
@manovaspace/pwa/react SerwistShell client provider
@manovaspace/pwa/sw Default service worker entry
Section titled “Related”