From aa5cf74173f515b138a50353c7dee7e4027f3c6d Mon Sep 17 00:00:00 2001 From: shanyun Date: Sun, 6 Nov 2022 18:44:50 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E4=B8=80=E5=91=A8?= =?UTF-8?q?=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 8 ++--- src/directory-parser.js | 55 ++++++++++++++++++++++++++++++++-- tests/directory-parser.spec.js | 25 ++++++++-------- 3 files changed, 68 insertions(+), 20 deletions(-) diff --git a/package-lock.json b/package-lock.json index 16d7e41..bd3831d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { - "name": "vite-plugin-auto-routes", - "version": "0.1.1", + "name": "homework14", + "version": "0.0.1", "lockfileVersion": 2, "requires": true, "packages": { "": { - "name": "vite-plugin-auto-routes", - "version": "0.1.1", + "name": "homework14", + "version": "0.0.1", "license": "MIT", "dependencies": { "common-tags": "^1.8.0", diff --git a/src/directory-parser.js b/src/directory-parser.js index 66960a2..29714d6 100644 --- a/src/directory-parser.js +++ b/src/directory-parser.js @@ -1,3 +1,4 @@ +const { log } = require('console') const fs = require('fs') const path = require('path') @@ -6,9 +7,57 @@ function parsePagesDirectory( { prependName, prependPath } = { prependName: '', prependPath: '/' }, ) { let routes = [] - - //TODO - + // prependPath = prependPath.replace(/\:/g, "_") + let pathAddress = path.resolve(__dirname, '../', dir, prependPath.substring(1).replace(/\:/g, "_")) + // 当前路径的文件夹下有哪些文件和子文件夹 + let subFileorDir = fs.readdirSync(pathAddress) + // 用来记录拥有子组件的元素的索引 + let hasChildren = [] + routes = subFileorDir.reduce((arr, curr) => { + let { name, base } = path.parse(curr) + name = name.replace(/^_/, ':') + if (fs.statSync(path.resolve(pathAddress, curr)).isFile()) { + if (name.indexOf('ignored') !== -1) { + return arr + } + if (subFileorDir.includes(name.replace(/\:/, '_'))) { + hasChildren.push({ valIdx: arr.length, name: name }) + } + if (name === 'index') { + arr.push(`{ name: '${prependName ? `${prependName}` : `${name.replace(/\:/g, '')}`}', path: '${prependPath}', component: () => import('/${dir}${prependPath.replace(/\:/g, "_")}${base}') }`) + return arr + } + arr.push(`{ name: '${prependName ? `${prependName}-${name.replace(/\:/g, '')}` : `${name.replace(/\:/g, '')}`}', path: '${prependPath}${name}', component: () => import('/${dir}${prependPath.replace(/\:/g, "_")}${base}') }`) + return arr + } else if (fs.statSync(path.resolve(pathAddress, curr)).isDirectory()) { + let { routes: routesTemp } = parsePagesDirectory(dir, { prependName: `${prependName ? prependName+'-' : ''}${name.replace(/\:/g, '')}`, prependPath: `${prependPath}${name}/` }) + arr.push(...routesTemp) + return arr + } + }, []) + // 处理存在子组件的情况 + hasChildren.forEach(({ valIdx, name }) => { + let tempStr = '' + // 遍历 routes 找到子组件，进行处理 + routes.forEach((item, index) => { + if (item && item.indexOf(`${name.replace(/\:/, '')}-`) !== -1) { + item = item.replace(new RegExp(`path: '/:?${name}/`), `path: '`) + tempStr += `${item}, ` + delete routes[index] + return + } + if (item && item.indexOf(`name: '${name.replace(/\:/, '')}'`) !== -1 && index !== valIdx) { + item = item.replace(new RegExp(`path: '/:?${name}/`), `path: '`) + tempStr += `${item}, ` + delete routes[index] + return + } + }) + tempStr = tempStr.replace(/, $/, '') + routes[valIdx] = routes[valIdx].replace(`name: '${name.replace(/\:/, '')}', `, '') + routes[valIdx] = routes[valIdx].replace(' }', `, children: [ ${tempStr} ] }`) + }) + routes = routes.filter(val => val) return { routes } } diff --git a/tests/directory-parser.spec.js b/tests/directory-parser.spec.js index a6d4fdc..6bca143 100644 --- a/tests/directory-parser.spec.js +++ b/tests/directory-parser.spec.js @@ -39,9 +39,9 @@ test('directory with a little nesting', () => { `{ name: 'contact', path: '/contact', component: () => import('/${dir}/contact.vue') }`, `{ name: 'index', path: '/', component: () => import('/${dir}/index.vue') }`, `{ name: 'level1-about', path: '/level1/about', component: () => import('/${dir}/level1/about.vue') }`, - `{ name: 'level1-team', path: '/level1/team', component: () => import('/${dir}/level1/team.vue') }`, `{ name: 'level1-level2-deep', path: '/level1/level2/deep', component: () => import('/${dir}/level1/level2/deep.vue') }`, `{ name: 'level1-level2', path: '/level1/level2/', component: () => import('/${dir}/level1/level2/index.vue') }`, + `{ name: 'level1-team', path: '/level1/team', component: () => import('/${dir}/level1/team.vue') }` ]) }) @@ -69,10 +69,10 @@ test('directory with some params', () => { expect(routes).toEqual([ `{ name: 'about', path: '/about', component: () => import('/${dir}/about.vue') }`, + `{ name: 'team-join', path: '/team/join', component: () => import('/${dir}/team/join.vue') }`, + `{ name: 'team-name', path: '/team/:name', component: () => import('/${dir}/team/_name.vue') }`, `{ name: 'product-buy', path: '/:product/buy', component: () => import('/${dir}/_product/buy.vue') }`, `{ name: 'product-sell', path: '/:product/sell', component: () => import('/${dir}/_product/sell.vue') }`, - `{ name: 'team-name', path: '/team/:name', component: () => import('/${dir}/team/_name.vue') }`, - `{ name: 'team-join', path: '/team/join', component: () => import('/${dir}/team/join.vue') }`, ]) }) @@ -81,18 +81,8 @@ test('directory with everything', () => { const { routes } = parsePagesDirectory(dir) expect(routes).toEqual([ - oneLine`{ - path: '/:product', - component: () => import('/${dir}/_product.vue'), - children: [ - { name: 'product-buy', path: 'buy', component: () => import('/${dir}/_product/buy.vue') }, - { name: 'product', path: '', component: () => import('/${dir}/_product/index.vue') }, - { name: 'product-sell', path: 'sell', component: () => import('/${dir}/_product/sell.vue') } - ] - }`, `{ name: 'about', path: '/about', component: () => import('/${dir}/about.vue') }`, oneLine`{ - name: 'contact', path: '/contact', component: () => import('/${dir}/contact.vue'), children: [ @@ -101,5 +91,14 @@ test('directory with everything', () => { ] }`, `{ name: 'index', path: '/', component: () => import('/${dir}/index.vue') }`, + oneLine`{ + path: '/:product', + component: () => import('/${dir}/_product.vue'), + children: [ + { name: 'product-buy', path: 'buy', component: () => import('/${dir}/_product/buy.vue') }, + { name: 'product', path: '', component: () => import('/${dir}/_product/index.vue') }, + { name: 'product-sell', path: 'sell', component: () => import('/${dir}/_product/sell.vue') } + ] + }`, ]) }) From b6f46bd3c7f98a66f82f5f287a638201d0bbaabf Mon Sep 17 00:00:00 2001 From: shanyun Date: Sun, 6 Nov 2022 18:45:19 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E7=AC=AC=E5=8D=81=E4=B8=80=E5=91=A8?= =?UTF-8?q?=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/directory-parser.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/directory-parser.js b/src/directory-parser.js index 29714d6..e139202 100644 --- a/src/directory-parser.js +++ b/src/directory-parser.js @@ -1,4 +1,3 @@ -const { log } = require('console') const fs = require('fs') const path = require('path')