#create routes with getStaticPaths dynamically without folder structure

4 messages · Page 1 of 1 (latest)

last canyon
#

Is it possible to combine two [...slug.]astro files? One is in the folder 'src/pages/[...slug].astro and the other 'src/pages/[lang]/[,,,aslug].astro'. This combination is used with a CMS that is sometimes multilang and sometimes singellang

viscid mulchBOT
#

Hi @last canyon. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

Yes, it is possible to create dynamic routes in Astro using the getStaticPaths() function and the rest parameter ([...slug]). This allows you to generate pages for slugs of different depths.

For example, you can have a file src/pages/[...slug].astro to handle routes of varying depths. Here's an example of how you might use getStaticPaths() in this file:

---export async function getStaticPaths() {  
  const pages = [    
    {      
      slug: undefined,      
      title: "Astro Store",      
      text: "Welcome to the Astro store!",    
    },    
    {      
      slug: "products",      
      title: "Astro products",      
      text: "We have lots of products for you",    
    },    
    {      
      slug: "products/astro-handbook",      
      title: "The ultimate Astro handbook",      
      text: "If you want to learn Astro, you must read this book.",    
    },  
  ];  
  return pages.map(({ slug, title, text }) => {    
    return {      
      params: { slug },      
      props: { title, text },    
    };  
  });
}
const { title, text } = Astro.props;---<html>  <head>    <title>{title}</title>  </head>  <body>    <h1>{title}</h1>    <p>{text}</p>  </body></html>

(Source: Astro Documentation (https://docs.astro.build/en/guides/routing/#example-dynamic-pages-at-multiple-levels))

Similarly, you can have another file src/pages/[lang]/[...slug].astro to handle routes that include a language parameter. The getStaticPaths() function in this file would be similar, but would also include the lang parameter.

However, please note that the two [...slug].astro files would handle different sets of routes and would not be combined. The routing is determined by the file and folder structure in the src/pages/ directory.

#

If you want to handle multilingual content, you might consider fetching the appropriate content based on the lang parameter in your getStaticPaths() function, possibly by making a request to your CMS.

For more information on routing in Astro, you can refer to the Astro Documentation on Routing (https://docs.astro.build/en/guides/routing/).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: