Workbox outputted to wrong directory when generating SPA

[cwhitby]

Version

v2.3.0

Reproduction link

https://codesandbox.io/s/m3kkj8o588

Steps to reproduce

Use a basic Nuxt.js template. Add the @nuxtjs/pwa module. Run nuxt generate.

What is expected ?

The workbox file is generated in dist/_nuxt.

What is actually happening?

The file is generated, but is instead placed in .nuxt/dist.

Additional comments?

This appears to be the correct location for the file when using the build command. But it still uses this directory when generating a SPA resulting in the not being found by the service worker.

_{This bug report is available on Nuxt community (#c60)}

[uniibu]

I'm having similar issue, however, mine is that it is generating wrong minifest list on the sw.js. Upon investigation, this is most likely due to a recent update made on nuxt-edge nuxt/nuxt#3758 which separates the client files from the server files.

Before both client and server files are served at .nuxt/dist now it is now located at .nuxt/dist/client and .nuxt/dist/server. And because of that change, my sw.js file's route urls are all wrong(they now have client appended them)
Example of my sw.js file:

importScripts('/_nuxt/workbox.42554690.js');

workbox.precaching.precacheAndRoute([
  {
    'url': '/_nuxt/client/0890adc3636ba2ec1067.min.js',
    'revision': '70d252cb7a0fd48aa2ddefeacc932c6a'
  },
  {
    'url': '/_nuxt/client/1ce73f39061d056835ee.min.js',
    'revision': 'a64c9bc40fb176bc22a127277065fb3e'
  },
  {
    'url': '/_nuxt/client/5f597c405d20afa7bdeb.min.js',
    'revision': '5d38cd8c2cb0929828b64584dc8f663c'
  }
// ...

That's one issue, second issue, is the workbox.xxx.js it self. This file is still being written on .nuxt/dist/ directory hence nuxt-edge no longer sees this file. This file must be moved to .nuxt/dist/client/

[eatyrghost]

Commenting to follow this issue. I've temporarily added a cleanup task to copy the workbox.*.js file and the client and server directories after generation.

[pi0]

Thanks for the bug report. We need to somehow find out current nuxt version has nuxt/nuxt#3758 changes or not! And then update globDirectory to default into this:

globDirectory: path.resolve(this.options.buildDir, 'dist/client'),

[c5n8]

Is there a workaround for this? I tried to manually copy workbox file to _nuxt folder, but browser still can't find it, even after clearing cache.

[galvez]

@chabib I believe @pi0 will release a new version tomorrow.

[uniibu]

@pi0 could we get a patch release for this? Thanks

[pi0]

2.4.0 is out. Sorry for delay.

https://github.com/nuxt-community/pwa-module/releases/tag/v2.4.0

[P4sca1]

I am still getting errors with nuxt 2.0, nuxt-pwa 2.6.0 (using nuxt ssr programatically).

A bad HTTP response code (404) was received when fetching the script.
sw.js:1 Uncaught DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'http://localhost:3000/_nuxt/workbox.678c6960.js' failed to load.
    at http://localhost:3000/sw.js:1:1
    at http://localhost:3000/OneSignalSDKWorker.js?appId=xxxx-xxxxx-xxxx-xxxx-xxxx:1:1

Edit: Seemed to be a problem with my environment.

[manylov]

I am still getting errors with nuxt 2.0, nuxt-pwa 2.6.0 (using nuxt ssr programatically).

A bad HTTP response code (404) was received when fetching the script.
sw.js:1 Uncaught DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'http://localhost:3000/_nuxt/workbox.678c6960.js' failed to load.
    at http://localhost:3000/sw.js:1:1
    at http://localhost:3000/OneSignalSDKWorker.js?appId=xxxx-xxxxx-xxxx-xxxx-xxxx:1:1

Edit: Seemed to be a problem with my environment.

same issue, what is your environment problem?

[ahoebeke]

I am still getting errors with nuxt 2.0, nuxt-pwa 2.6.0 (using nuxt ssr programatically).

A bad HTTP response code (404) was received when fetching the script.
sw.js:1 Uncaught DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'http://localhost:3000/_nuxt/workbox.678c6960.js' failed to load.
    at http://localhost:3000/sw.js:1:1
    at http://localhost:3000/OneSignalSDKWorker.js?appId=xxxx-xxxxx-xxxx-xxxx-xxxx:1:1

Edit: Seemed to be a problem with my environment.

@P4sca1 @manylov Could you share your solution? :)

[P4sca1]

I never had time to investigate the issue and stopped using the pwa module for now.

[manylov]

'@nuxtjs/onesignal' must be before '@nuxtjs/pwa' in nuxt.config.js modules:[] section

[jillztom]

@manylov I have the same error. How did you solve it? @nuxtjs/onesignal is on top of @nuxtjs/pwa and still have the same error.