[Bug]: Serwist is failing to compile for the client if the project has imports of JSON modules about serwist HOT 4 CLOSED

@DuCanhGH I tried to reproduce the issue in the Sandbox, but unfortunately I couldn't get it to throw the same error I was getting. I will close this issue, as there is no way to know what really went wrong (maybe someone in the future stumbles upon the issue and can reproduce it). Thanks for taking the time to look into it, though.

from serwist.

Right, disabling Serwist works, but I don't see how that means this is related to it. This issue just screams Next.js or Webpack. There's nothing in @serwist/webpack-plugin that can cause such a horrendous issue. It simply creates separate child compilations to compile its own things. @serwist/next can't be related either. It intercepts main-app and main.js, which are the main entrypoints of your app, to add its own code, but it doesn't touch anything else, including the file in the error. I don't think it is really related to JSON modules, since you, too, can't reproduce it. Maybe you should try removing the JSON modules to verify, if that's possible? Perhaps there're some deeper issues with your actual app, but I don't have access to it so here we are.

P/s: I don't see why you have to hide the JSON part to be honest. It ends up in the client bundle anyway, so there shouldn't be any secret in it, should there be?

from serwist.

@DuCanhGH You are right, the packages you mentioned were not the issue.

To your argument, I could also say the same. Serwist was the only variable in the equation, how is it not an issue with Serwist (maybe not directly, but there is something).

Anyway, I tried every combination possible for package configuration (in next.config.js) and service worker configuration (in service-worker.ts), and I narrowed the issue down to this:

The issue I mentioned with JSON loading happens only if I configure precacheOptions.urlManipulation when I call installSerwist() function.

I was trying to provide alternative URLs for a resource from another language if it exists.

So you know what I am trying to do, (maybe it's wrong, this is at least what I understood from code documentation), here is a code snippet:

const i18n = { defaultLocale: 'en', locales: ['en', 'de'] };

installSerwist({
  // other options ...
  precacheOptions: {
    // other options ...
    // this option causes Serwist to fail in production build
    urlManipulation: ({ url }: { url: URL }): URL[] => {
      const path = url.pathname.replace(new RegExp(`^/(${i18n.locales.join('|')})/`), '/');

      return i18n.locales
        .filter(locale => locale !== i18n.defaultLocale) // default locale doesn't have prefix (accessible from "/")
        .map(locale => new URL('/' + locale + path, url));
    },
  },
});

from serwist.

@MarwanAlsoltany huh, now that you have narrowed down the issue, would a reproduction be possible? I'd really appreciate it, since there's not much I can do if there's nothing to experiment with...

from serwist.