Home

I’m facing a quite similar issue as mentioned here: https://github.com/nuxt/nuxt.js/issues/112

My goal is to have dynamic routes with lang and slug :lang/:slug. To achieve this I want to replace my :lang routes with a simple regex :lang([a-z]{2}) via the extendRoutes function inside the nuxt.config.js. Which then should only accept :lang with max. 2 characters, everything else should be read as a :slug.

The routes seem to be created correctly, for example:

{ 
  name: 'lang',
  path: '/:lang([a-z]{2})',
  component: '/Users/fabian/dev/intrinsic/pages/_lang/index.vue',
  chunkName: 'pages/_lang/index'
},
{
  name: 'slug',
  path: '/:slug',
  component: '/Users/fabian/dev/intrinsic/pages/_slug.vue',
  chunkName: 'pages/_slug'
},
{
  name: 'lang-slug',
  path: '/:lang([a-z]{2})/:slug',
  component: '/Users/fabian/dev/intrinsic/pages/_lang/_slug.vue',
  chunkName: 'pages/_lang/_slug'
}

But for example if I navigate to /test, I end up having test as my lang param and the router sends me to the :lang page.

Q: Is it possible to use regex inside extendRoutes at the moment with nuxt? Does anyone have an idea on how to achieve dynamic routes with :lang/:slug if the lang always consists of 2 characters (and is optional)?

Many thanks in advance! 🙏🏻