From e1df19c91d5d541b2f307aef7722cc59c6841e54 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Sat, 14 May 2022 14:35:21 +0100 Subject: [PATCH 1/4] fix: sort routes with slugs at the end --- packages/nuxt/src/pages/utils.ts | 3 +++ packages/nuxt/test/pages.test.ts | 32 +++++++++++++++++++------------- 2 files changed, 22 insertions(+), 13 deletions(-) diff --git a/packages/nuxt/src/pages/utils.ts b/packages/nuxt/src/pages/utils.ts index eb91468cb89..6b1ee5f7943 100644 --- a/packages/nuxt/src/pages/utils.ts +++ b/packages/nuxt/src/pages/utils.ts @@ -88,11 +88,14 @@ export function generateRoutesFromFiles (files: string[], pagesDir: string): Nux } parent.push(route) + parent.sort((a, b) => normalizePath(a.path).localeCompare(normalizePath(b.path))) } return prepareRoutes(routes) } +const normalizePath = (path: string) => path.replace(/^\//, '').replace(/:/, 'z') + function getRoutePath (tokens: SegmentToken[]): string { return tokens.reduce((path, token) => { return ( diff --git a/packages/nuxt/test/pages.test.ts b/packages/nuxt/test/pages.test.ts index ec2d5aeb82f..d5ff507183a 100644 --- a/packages/nuxt/test/pages.test.ts +++ b/packages/nuxt/test/pages.test.ts @@ -105,11 +105,17 @@ describe('pages:generateRoutesFromFiles', () => { ], output: [ { - name: 'slug', - path: '/:slug', - file: `${pagesDir}/[slug].vue`, + name: 'sub-slug', + path: '/sub/:slug', + file: `${pagesDir}/sub/[slug].vue`, children: [] }, + { + children: [], + name: 'bar', + file: 'pages/[bar]/index.vue', + path: '/:bar' + }, { children: [ { @@ -124,15 +130,9 @@ describe('pages:generateRoutesFromFiles', () => { path: '/:foo?' }, { - children: [], - name: 'bar', - file: 'pages/[bar]/index.vue', - path: '/:bar' - }, - { - name: 'sub-slug', - path: '/sub/:slug', - file: `${pagesDir}/sub/[slug].vue`, + name: 'slug', + path: '/:slug', + file: `${pagesDir}/[slug].vue`, children: [] }, { @@ -145,8 +145,14 @@ describe('pages:generateRoutesFromFiles', () => { }, { description: 'should generate correct catch-all route', - files: [`${pagesDir}/[...slug].vue`], + files: [`${pagesDir}/[...slug].vue`, `${pagesDir}/index.vue`], output: [ + { + name: 'index', + path: '/', + file: `${pagesDir}/index.vue`, + children: [] + }, { name: 'slug', path: '/:slug(.*)*', From ee1d71221c7fe363e6f337ddd7c5dbbcf8a7199a Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Thu, 9 Jun 2022 12:21:16 +0100 Subject: [PATCH 2/4] fix: use `~` and update name + todo --- packages/nuxt/src/pages/utils.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/nuxt/src/pages/utils.ts b/packages/nuxt/src/pages/utils.ts index 6b1ee5f7943..9ca3350fbc2 100644 --- a/packages/nuxt/src/pages/utils.ts +++ b/packages/nuxt/src/pages/utils.ts @@ -88,13 +88,14 @@ export function generateRoutesFromFiles (files: string[], pagesDir: string): Nux } parent.push(route) - parent.sort((a, b) => normalizePath(a.path).localeCompare(normalizePath(b.path))) + // TODO: https://github.com/vuejs/router/issues/1435 + parent.sort((a, b) => getSortablePath(a.path).localeCompare(getSortablePath(b.path))) } return prepareRoutes(routes) } -const normalizePath = (path: string) => path.replace(/^\//, '').replace(/:/, 'z') +const getSortablePath = (path: string) => path.replace(/^\//, '').replace(/:/, '~') function getRoutePath (tokens: SegmentToken[]): string { return tokens.reduce((path, token) => { From 2c316bb7c51f39b5e41145be260fc9d32096d45e Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Thu, 9 Jun 2022 12:35:06 +0100 Subject: [PATCH 3/4] fix: use `z` --- packages/nuxt/src/pages/utils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/nuxt/src/pages/utils.ts b/packages/nuxt/src/pages/utils.ts index 9ca3350fbc2..936ae1cbf0f 100644 --- a/packages/nuxt/src/pages/utils.ts +++ b/packages/nuxt/src/pages/utils.ts @@ -95,7 +95,7 @@ export function generateRoutesFromFiles (files: string[], pagesDir: string): Nux return prepareRoutes(routes) } -const getSortablePath = (path: string) => path.replace(/^\//, '').replace(/:/, '~') +const getSortablePath = (path: string) => path.replace(/^\//, '').replace(/:/, 'z') function getRoutePath (tokens: SegmentToken[]): string { return tokens.reduce((path, token) => { From 530c4cd317996b0a0c6a1aa279d9aedc30855fb7 Mon Sep 17 00:00:00 2001 From: pooya parsa Date: Thu, 9 Jun 2022 14:02:58 +0200 Subject: [PATCH 4/4] Update packages/nuxt/src/pages/utils.ts --- packages/nuxt/src/pages/utils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/nuxt/src/pages/utils.ts b/packages/nuxt/src/pages/utils.ts index 936ae1cbf0f..2d3670ad686 100644 --- a/packages/nuxt/src/pages/utils.ts +++ b/packages/nuxt/src/pages/utils.ts @@ -95,7 +95,7 @@ export function generateRoutesFromFiles (files: string[], pagesDir: string): Nux return prepareRoutes(routes) } -const getSortablePath = (path: string) => path.replace(/^\//, '').replace(/:/, 'z') +const getSortablePath = (path: string) => path.replace(/^\//, '').replace(/:/, 'Z') function getRoutePath (tokens: SegmentToken[]): string { return tokens.reduce((path, token) => {