diff --git a/packages/builder/src/builder.js b/packages/builder/src/builder.js index 2cfa42c777..cb16dd57f8 100644 --- a/packages/builder/src/builder.js +++ b/packages/builder/src/builder.js @@ -325,7 +325,9 @@ export default class Builder { if (this._defaultPage) { templateVars.router.routes = createRoutes( ['index.vue'], - this.template.templatesDir + '/pages' + this.template.templatesDir + '/pages', + '', + this.options.router.routeNameSplitter ) } else if (this._nuxtPages) { // Use nuxt.js createRoutes bases on pages/ @@ -342,7 +344,8 @@ export default class Builder { templateVars.router.routes = createRoutes( Object.values(files), this.options.srcDir, - this.options.dir.pages + this.options.dir.pages, + this.options.router.routeNameSplitter ) } else { // If user defined a custom method to create routes templateVars.router.routes = this.options.build.createRoutes( diff --git a/packages/common/src/utils.js b/packages/common/src/utils.js index 127a4ce85c..b4c52d90cb 100644 --- a/packages/common/src/utils.js +++ b/packages/common/src/utils.js @@ -211,13 +211,14 @@ export const flatRoutes = function flatRoutes(router, _path = '', routes = []) { return routes } -function cleanChildrenRoutes(routes, isChild = false) { +function cleanChildrenRoutes(routes, isChild = false, routeNameSplitter = '-') { let start = -1 + const regExpIndex = new RegExp(`${routeNameSplitter}index$`) const routesIndex = [] routes.forEach((route) => { - if (/-index$/.test(route.name) || route.name === 'index') { + if (regExpIndex.test(route.name) || route.name === 'index') { // Save indexOf 'index' key in name - const res = route.name.split('-') + const res = route.name.split(routeNameSplitter) const s = res.indexOf('index') start = start === -1 || s < start ? s : start routesIndex.push(res) @@ -226,7 +227,7 @@ function cleanChildrenRoutes(routes, isChild = false) { routes.forEach((route) => { route.path = isChild ? route.path.replace('/', '') : route.path if (route.path.includes('?')) { - const names = route.name.split('-') + const names = route.name.split(routeNameSplitter) const paths = route.path.split('/') if (!isChild) { paths.shift() @@ -246,12 +247,12 @@ function cleanChildrenRoutes(routes, isChild = false) { }) route.path = (isChild ? '' : '/') + paths.join('/') } - route.name = route.name.replace(/-index$/, '') + route.name = route.name.replace(regExpIndex, '') if (route.children) { if (route.children.find(child => child.path === '')) { delete route.name } - route.children = cleanChildrenRoutes(route.children, true) + route.children = cleanChildrenRoutes(route.children, true, routeNameSplitter) } }) return routes @@ -316,7 +317,7 @@ const sortRoutes = function sortRoutes(routes) { return routes } -export const createRoutes = function createRoutes(files, srcDir, pagesDir) { +export const createRoutes = function createRoutes(files, srcDir, pagesDir = '', routeNameSplitter = '-') { const supportedExtensions = ['vue', 'js', 'ts'] const routes = [] files.forEach((file) => { @@ -333,7 +334,7 @@ export const createRoutes = function createRoutes(files, srcDir, pagesDir) { const sanitizedKey = key.startsWith('_') ? key.substr(1) : key route.name = route.name - ? route.name + '-' + sanitizedKey + ? route.name + routeNameSplitter + sanitizedKey : sanitizedKey route.name += key === '_' ? 'all' : '' route.chunkName = file.replace(new RegExp(`\\.(${supportedExtensions.join('|')})$`), '') @@ -357,7 +358,7 @@ export const createRoutes = function createRoutes(files, srcDir, pagesDir) { }) sortRoutes(routes) - return cleanChildrenRoutes(routes) + return cleanChildrenRoutes(routes, false, routeNameSplitter) } // Guard dir1 from dir2 which can be indiscriminately removed diff --git a/packages/config/src/config/router.js b/packages/config/src/config/router.js index 28bbf404cd..3b0a316a6d 100644 --- a/packages/config/src/config/router.js +++ b/packages/config/src/config/router.js @@ -2,6 +2,7 @@ export default () => ({ mode: 'history', base: '/', routes: [], + routeNameSplitter: '-', middleware: [], linkActiveClass: 'nuxt-link-active', linkExactActiveClass: 'nuxt-link-exact-active', diff --git a/test/fixtures/route-name-splitter/nuxt.config.js b/test/fixtures/route-name-splitter/nuxt.config.js new file mode 100644 index 0000000000..8f72308a6d --- /dev/null +++ b/test/fixtures/route-name-splitter/nuxt.config.js @@ -0,0 +1,5 @@ +export default { + router: { + routeNameSplitter: '/' + } +} diff --git a/test/fixtures/route-name-splitter/pages/_/_.vue b/test/fixtures/route-name-splitter/pages/_/_.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/pages/_/index.vue b/test/fixtures/route-name-splitter/pages/_/index.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/pages/_/p/_.vue b/test/fixtures/route-name-splitter/pages/_/p/_.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/pages/index.vue b/test/fixtures/route-name-splitter/pages/index.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/pages/parent/child.vue b/test/fixtures/route-name-splitter/pages/parent/child.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/pages/parent/index.vue b/test/fixtures/route-name-splitter/pages/parent/index.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/pages/posts.vue b/test/fixtures/route-name-splitter/pages/posts.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/pages/posts/_id.vue b/test/fixtures/route-name-splitter/pages/posts/_id.vue new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/fixtures/route-name-splitter/route-name-splitter.test.js b/test/fixtures/route-name-splitter/route-name-splitter.test.js new file mode 100644 index 0000000000..61147da103 --- /dev/null +++ b/test/fixtures/route-name-splitter/route-name-splitter.test.js @@ -0,0 +1,3 @@ +import { buildFixture } from '../../utils/build' + +buildFixture('route-name-splitter') diff --git a/test/unit/route-name-splitter.test.js b/test/unit/route-name-splitter.test.js new file mode 100644 index 0000000000..9595788d4d --- /dev/null +++ b/test/unit/route-name-splitter.test.js @@ -0,0 +1,33 @@ +import { resolve } from 'path' +import fs from 'fs' +import { promisify } from 'util' + +const readFile = promisify(fs.readFile) + +describe('route-name-splitter', () => { + test('Check routes names', () => { + return readFile( + resolve(__dirname, '..', 'fixtures/route-name-splitter/.nuxt/router.js'), + 'utf-8' + ).then((routerFile) => { + routerFile = routerFile + .slice(routerFile.indexOf('routes: [')) + .replace('routes: [', '[') + .replace(/ _[0-9A-z]+,/g, ' "",') + routerFile = routerFile.substr( + routerFile.indexOf('['), + routerFile.lastIndexOf(']') + 1 + ) + const routes = eval('( ' + routerFile + ')') // eslint-disable-line no-eval + + expect(routes[0].name).toBe('parent') + expect(routes[1].name).toBe('posts') + expect(routes[1].children[0].name).toBe('posts/id') + expect(routes[2].name).toBe('parent/child') + expect(routes[3].name).toBe('index') + expect(routes[4].name).toBe('all/p/all') + expect(routes[5].name).toBe('all/all') + expect(routes[6].name).toBe('all') + }) + }) +})