example/sveltekit-ts doesn't preview on fresh clone (url not precahed) about sveltekit HOT 19 CLOSED

@GaryB432 I Will check it tmr

from sveltekit.

@GaryB432 I cannot reproduce your warning, SvelteKit do 2 builds, your warning can be shown when building the client, since SvelteKit prerender process has not yet run, and so, prerendered folder missing: check this response #27 (comment)

from sveltekit.

@GaryB432 can you check the version of SvelteKit? We're trying to fix this plugin, latest SvelteKit changes breaks pwa plugin

from sveltekit.

+-- @sveltejs/[email protected]
| `-- @sveltejs/[email protected] deduped
+-- @sveltejs/[email protected]
`-- @vite-pwa/[email protected]
  `-- @sveltejs/[email protected] deduped

from sveltekit.

Thanks for looking! That makes sense for the warning for the server build phase. My bigger issue is the uncaught non-precached-url error in the browser dev tools that is keeping the example from running. Is that one reproducible?

from sveltekit.

@GaryB432 I sent a new PR, maybe it is related with your problem #30, with that patch it is working, not tested with current version:

from sveltekit.

That is a beautiful screenshot. I will monitor the PR and try again when merged. thanks!

from sveltekit.

monkey-patching and observing createManifestTransform, I see that all the entries have urls that start with client/ and none of them end with .html. Not event index.html is in entries. No prerendered or anything else in the sample. So the if block is set up for other adapters (?? over my head!) Maybe that's related to the createHandlerBoundToURL('/') not finding /.

from sveltekit.

yes, you can provide your own manifestTransform, copy the one in the PR and add it on workbox: { manifestTransform: [] } array, it should work

from sveltekit.

It is the one from the PR that does not include index.html in entries so line 88 is not hit. I don't know enough about the output folder or sveltekit internals yet to know how to add it. Moreover, I am unsure the sample is more than a suggestion and should work out of the box (my assumption) is correct.

from sveltekit.

@GaryB432
Try this, add it to your pwa options, if workbox present just copy the manifestTransform array (ignoring sveltekit options, I just review the options and update the values: suffix: '', adapterFallback: false):

workbox: {
  manifestTransform: [async (entries) => {
        const defaultAdapterFallback = 'prerendered/fallback.html'
        const suffix = '' // options?.trailingSlash === 'always' ? '/' : ''
        let adapterFallback = false // options?.adapterFallback
        let excludeFallback = false
        // the fallback will be always generated by SvelteKit.
        // The adapter will copy the fallback only if it is provided in its options: we need to exclude it
        if (!adapterFallback) {
          adapterFallback = defaultAdapterFallback
          excludeFallback = true
        }

        // the fallback will be always in .svelte-kit/output/prerendered/fallback.html
        const manifest = entries.filter(({ url }) => !(excludeFallback && url === defaultAdapterFallback)).map((e) => {
        let url = e.url
        // client assets in `.svelte-kit/output/client` folder.
        // SSG pages in `.svelte-kit/output/prerendered/pages` folder.
        // fallback page in `.svelte-kit/output/prerendered` folder (fallback.html is the default).
        if (url.startsWith('client/'))
          url = url.slice(7)

        else if (url.startsWith('prerendered/pages/'))
          url = url.slice(18)

        else if (url === defaultAdapterFallback)
          url = adapterFallback!

        if (url.endsWith('.html')) {
          if (url.startsWith('/'))
            url = url.slice(1)

          if (url === 'index.html') {
            url = base
          }
          else {
            const idx = url.lastIndexOf('/')
            if (idx > -1) {
              // abc/index.html -> abc/?
              if (url.endsWith('/index.html'))
                url = `${url.slice(0, idx)}${suffix}`
              // abc/def.html -> abc/def/?
              else
                url = `${url.substring(0, url.lastIndexOf('.'))}${suffix}`
            }
            else {
              // xxx.html -> xxx/?
              url = `${url.substring(0, url.lastIndexOf('.'))}${suffix}`
            }
          }
        }

        e.url = url

        return e
      })

      return { manifest }
  }],
}

from sveltekit.

hmmm.. Cannot find name "base" and Type 'string' is not assignable to type 'boolean'. for adapterFallback in a couple places. (clarifying I am trying to build examples/sveltekit-ts on a fresh clone.)

from sveltekit.

Change url = base with base = '/'

from sveltekit.

hmmm.. Cannot find name "base" and Type 'string' is not assignable to type 'boolean'. for adapterFallback in a couple places. (clarifying I am trying to build examples/sveltekit-ts on a fresh clone.)

Yes, I configure previous manifestTransform using the example, no fallback and no suffix, I forgot to replace base with '/'...

from sveltekit.

I added const base = '/' and also, because adapterFallback is now a boolean and not assignable to url, I replaced else if (url === defaultAdapterFallback) url = adapterFallback! with else if (url === defaultAdapterFallback) throw new Error("defaultAdapterFallback is not supported").

Still getting Uncaught non-precached-url: createHandlerBoundToURL('/') was called, but that URL is not precached. as in the OP

from sveltekit.

configure navigateFallback: null

from sveltekit.

I am not sure what that means. I wound up using the built-in service worker and making my own webmanifest per their documentation. I'll try vite-pwa again some day if I see this issue closed, i.e., the example runs.

from sveltekit.

As I continued testing, I found out that the problem was caused by missing index.html.

I forcibly added processing for index.html as follows.
As a result, it worked normally.

demo
https://my-dashboard-r96qwqiv0-chooco13.vercel.app/

// vite.config.ts

    injectManifest: {
        globPatterns: ["client/**/*.{js,css,ico,png,svg,webp,woff,woff2}"],
        manifestTransforms: [
          async (entries) => {
            entries.push({
              url: "/index.html",
              revision: null,
              size: 0,
            });

            // the fallback will be always in .svelte-kit/output/prerendered/fallback.html
            const manifest = entries
              .map((e) => {
                let url = e.url;
                console.log(url);

                if (url.startsWith("client/")) {
                  url = url.slice(7);
                } else if (url.startsWith("prerendered/pages/")) {
                  url = url.slice(18);
                }

                if (url.endsWith(".html")) {
                  if (url.startsWith("/")) {
                    url = url.slice(1);
                  }

                  if (url === "index.html") {
                    url = "/";
                  } else {
                    const idx = url.lastIndexOf("/");
                    if (idx > -1) {
                      // abc/index.html -> abc/?
                      if (url.endsWith("/index.html")) {
                        url = `${url.slice(0, idx)}`;
                      } // abc/def.html -> abc/def/?
                      else {
                        url = `${url.substring(0, url.lastIndexOf("."))}`;
                      }
                    } else {
                      // xxx.html -> xxx/?
                      url = `${url.substring(0, url.lastIndexOf("."))}`;
                    }
                  }
                }

                e.url = url;

                return e;
              });

            return { manifest };
          },
        ],
      },

from sveltekit.

closed via #32

from sveltekit.