Nuxt•2y ago

✨ Dynamic Sitemap with SSR without pre-render

Hello Discord, I'm currently using the simple-sitemap module to handle my sitemap. Since the site I'm building should be SSR without pre-rendering, I cant rely on the module to crawl my routes. So I want to query our CMS using the graphql-client module. I've tried the "sitemap:generate" hook and failed because it wouldn't import the generated GQL Query call. I'm now wondering what is the best way to implement this for my context? I kinda wanna make it work with simple-sitemap, but I'm almost ready to try just creating a sitemap.xml.ts in my server directory 😄

19 Replies

Unknown User•2y ago

Message Not Public

Maik•2y ago

Hmm I see. First of all thank you for the fast response. Its seems to me the behavior of simple-sitemap and @funken-studio/sitemap-nuxt-3 is quite similar. I think my biggest problem is the limitation of not being able to use imports inside the nuxt.config.ts. That's why it never found my gql calls and that's also why my config never quite worked out. The funken-studio approach with a server api route that resolves the gql/api call actually seems genius. Ill give it a shot and try my best with simple-sitemap, but I'll keep the package you recommended in mind.

Unknown User•2y ago

Message Not Public

harlan•2y ago

simple-sitemap is definitely suited towards prerendered apps but happy to get this working for you if you make an issue there might be a way to run your server and crawl for URLs outside of a prerender simple-sitemap aims to be minimal config

Maik•2y ago

Wow, thanks for the feedback. I'm currently trying a couple of solutions. I'll get back to you / the github issues 😊

Unknown User•2y ago

Message Not Public

harlan•2y ago

not too sure about the specifics of that module sorry

SunTzu•2y ago

Where is his example where you can import? For instance importing supabase module

Maik•2y ago

I've created a server endpoint providing the data and then I used fetch in the arrow function that provides the routes

sitemap: {
        cacheTime: 1,
        routes: async () =>
            (await fetch(useRuntimeConfig().siteUrl + "/api/routes")).json(),
        defaults: {
            priority: 1,
            lastmod: new Date().toISOString(),
        },
    }

sitemap: {
        cacheTime: 1,
        routes: async () =>
            (await fetch(useRuntimeConfig().siteUrl + "/api/routes")).json(),
        defaults: {
            priority: 1,
            lastmod: new Date().toISOString(),
        },
    }

in my api-route file I can now use composable imports as usual (Gql Example:)

let data = await GqlGetAllPages();

let data = await GqlGetAllPages();

I'm sure you could do this using useFetch. I'm not sure why I didn't

harlan•2y ago

https://github.com/harlan-zw/nuxt-simple-sitemap v2 may be useful if you're stuck with the other module

GitHub

GitHub - harlan-zw/nuxt-simple-sitemap: The simplest way to add XML...

The simplest way to add XML Sitemaps to your Nuxt 3 site. - GitHub - harlan-zw/nuxt-simple-sitemap: The simplest way to add XML Sitemaps to your Nuxt 3 site.

Maik•2y ago

Just browsed through the change logs. Looks amazing! Thanks for the continued development. I'll migrate as soon as I get the chance to 🙂

Unknown User•2y ago

Message Not Public

harlan•2y ago

Hey, the issue is that you're trying to use a nuxt app level composable in your nuxt config. This is why it's recommended to use an api endpoint for dynamic routes although you may still have the same issue if the sanity module doesn't expose the composable for the server

Unknown User•2y ago

Message Not Public

harlan•2y ago

Hm well if you're doing the URLs through nuxt config they won't be dynamic. In which case you should just prerender all pages and it should discover your sitemap entries automatically You'd just need to redeploy on content updates But I'm also sure there's an easy way to use the sanity API via the server routes

Gaming

Programming

✨ Dynamic Sitemap with SSR without pre-render