Livio Alvarenga
Livio Alvarenga

Reputation: 21

Encountering 'Unexpected token in JSON at position 0' Error When Using next-pwa with Next.js

Summary

I am encountering an 'Unexpected token ` in JSON at position 0' error when trying to run my Next.js project with next-pwa. The issue only occurs when I attempt to use next-pwa; without it, my project runs as expected.

Versions

How To Reproduce

Steps to reproduce the behavior:

Create a new Next.js project or use an existing one.

Install dependencies: "next": "13.4.7" and "next-pwa": "5.6.0".

Add the following next.config.js:

/** @type {import('next').NextConfig} */

// eslint-disable-next-line @typescript-eslint/no-var-requires
const withPWA = require('next-pwa')({
  dest: 'public',
  register: true,
  skipWaiting: true,
})

module.exports = withPWA({
  reactStrictMode: true,
})

Run npm run dev.

See the error in the console:

> [PWA] Compile client (static)
> [PWA] Auto register service worker with: C:\project\node_modules\next-pwa\register.js    
> [PWA] Service worker: C:\project\public\sw.js   
> [PWA]   url: /sw.js
> [PWA]   scope: /
> [PWA] Build in develop mode, cache and 
precache are mostly disabled. This means 
offline support is disabled, but you can 
continue developing other functions in service worker.
> [PWA] Compile server
> [PWA] Compile server
- error Unexpected token ` in JSON at position 0
- wait compiling...
- error Unexpected token ` in JSON at position 0

Expected Behaviors

I expected the project to run smoothly with next-pwa enabled for PWA capabilities. However, I encounter an 'Unexpected token in JSON at position 0' error when runningnpm run dev`.

Additional Context

In this project, both server-side and client-side fetch requests are being made with caching enabled. The issue seems to persist regardless of these operations, but it's worth noting as it might be related to the problem at hand.

Minimum repository to reproduce the error

https://github.com/LivioAlvarenga/pwa-next

I attempted to integrate the next-pwa library into my Next.js project to add PWA capabilities. I followed the documentation and set up my next.config.js as recommended. I expected the project to run smoothly with PWA support enabled. However, upon running npm run dev, I encountered an 'Unexpected token in JSON at position 0' error. This error only occurs when thenext-pwa` configuration is enabled. I tried debugging the code and checking all JSON files, but the issue persists.

Upvotes: 1

Views: 94

Answers (0)

Related Questions