nuxt-pwa-module: Module not working and all crashed

When I install and use the nuxt-pwa module, all other modules stop working.

For example, in the screenshot the @nuxtjs/tailwindcss module stopped working.

Config

pwa: {
		icon: {
			fileName: 'favicon.webp',
			splash: {
				backgroundColor: DarkColor[600],
				targetDir: '/',
				devices: [],
			},
		},
		workbox: {
			enabled: true,
		},
	},

Logs

Nuxi 3.0.0                                                                                                                                                                           21:50:29  
Nuxt 3.0.0 with Nitro 1.0.0                                                                                                                                                          21:50:29
                                                                                                                                                                                     21:50:36
  > Local:    http://localhost:3000/ 
  > Network:  http://192.168.100.143:3000/
                                                                                                                                                                                     21:50:29  
i Using html-validate to validate server-rendered HTML                                                                                                                               21:50:39
i Using default Tailwind CSS file from runtime/tailwind.css                                                                                                         nuxt:tailwindcss 21:50:41

 WARN  [PWA] Workbox is running in development mode                                                                                                                                  21:50:43

                                                                                                                                                                                     21:50:43
SEO Kit v0.4.14 • All-in-one SEO by @harlan_zw                                                                                                                                       21:50:43
  └─ 💖  Like this package? Consider sponsoring me on GitHub https://github.com/sponsors/harlan-zw                                                                                   21:50:43
                                                                                                                                                                                     21:50:43
i Tailwind Viewer: http://localhost:3000/_tailwind/                                                                                                                 nuxt:tailwindcss 21:50:46
√ PWA icons and splash screens generated in 12862 ms                                                                                                                                 21:50:59
i Vite client warmed up in 6064ms                                                                                                                                                    21:51:06
√ Nitro built in 1571 ms

Browser console

About this issue

Original URL
State: open
Created a year ago
Reactions: 1
Comments: 35 (13 by maintainers)

Most upvoted comments

@rahulkumarsingh73690 You’re right, I was missing a closing bracket, I’ve updated by snippet above.

kevinmarrec on Feb 21, 2023

@rahulkumarsingh73690 I don’t think your error is related to this change, there must be something else that triggers the failure

kevinmarrec on Feb 20, 2023

@rahulkumarsingh73690 Yes, it’s described in https://github.com/kevinmarrec/nuxt-pwa-module#configuration, it’s enabled for production by default, so you just need to remove pwa.workbox.enabled from your nuxt.config.ts.

kevinmarrec on Feb 10, 2023

@rahulkumarsingh73690 I think this is simply caused by using Workbox in development, you should expect no issues if doing nuxi build + nuxi start/nuxi preview (production build), instead of running Workbox on nuxi dev.

I may repeat myself at some places but Workbox in development is not reliable with Nuxt/Vite dev server, so you can expect assets issues with the worker enabled in development.

EDIT: Tried your project, it just run fine with production build, so it’s about using a Service Worker in development (which I don’t recommend, it should be enabled only for testing purposes and not for daily development)

kevinmarrec on Feb 10, 2023

@rahulkumarsingh73690 How have you been able to get these installability issues ?

I’m not able to see them 👇

kevinmarrec on Feb 8, 2023

@rahulkumarsingh73690 Thank you for your feedback, could you share your repository if public or create a reproduction so I can reproduce it straight away and find a fix ? Cause I’m afraid I won’t be able to debug it other way. Thanks.

kevinmarrec on Feb 3, 2023