Skip to content

Commit c3969f8

Browse files
authored
feat: 添加[...slug].vue方式替换*.vue实现模糊匹配 (WeBankFinTech#183)
1 parent a6a4f36 commit c3969f8

File tree

22 files changed

+226
-167
lines changed

22 files changed

+226
-167
lines changed

docs/guide/route.md

Lines changed: 153 additions & 109 deletions
Large diffs are not rendered by default.

packages/fes-preset-built-in/src/index.js

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,11 @@ export default function () {
66
require.resolve('./plugins/registerType'),
77

88
// generate files
9-
require.resolve('./plugins/generateFiles/core/plugin'),
10-
require.resolve('./plugins/generateFiles/core/exports/coreExports'),
11-
require.resolve('./plugins/generateFiles/core/exports/pluginExports'),
12-
require.resolve('./plugins/generateFiles/fes'),
13-
require.resolve('./plugins/generateFiles/genType'),
9+
require.resolve('./plugins/core/plugin'),
10+
require.resolve('./plugins/core/exports/coreExports'),
11+
require.resolve('./plugins/core/exports/pluginExports'),
12+
require.resolve('./plugins/core/entry'),
13+
require.resolve('./plugins/core/route'),
1414

1515
// bundle configs
1616
require.resolve('./plugins/features/alias'),
@@ -31,9 +31,6 @@ export default function () {
3131
require.resolve('./plugins/features/terserOptions'),
3232
require.resolve('./plugins/features/title'),
3333

34-
// route
35-
require.resolve('./plugins/route'),
36-
3734
// commands
3835
require.resolve('./plugins/commands/help'),
3936
require.resolve('./plugins/commands/info'),

packages/fes-preset-built-in/src/plugins/generateFiles/core/exports/coreExports.js renamed to packages/fes-preset-built-in/src/plugins/core/exports/coreExports.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { readFileSync } from 'fs';
22
import { join } from 'path';
3-
import generateExports from '../../../../utils/generateExports';
4-
import { runtimePath } from '../../../../utils/constants';
3+
import generateExports from '../../../utils/generateExports';
4+
import { runtimePath } from '../../../utils/constants';
55

66
export default function (api) {
77
api.onGenerateFiles(async () => {
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,25 @@
1-
import generateExports from '../../../../utils/generateExports';
1+
import generateExports from '../../../utils/generateExports';
22

33
export default function (api) {
44
api.onGenerateFiles(async () => {
55
const fesExports = await api.applyPlugins({
66
key: 'addPluginExports',
77
type: api.ApplyPluginsType.add,
8-
initialValue: []
8+
initialValue: [],
99
});
1010

1111
const fesExportsHook = {}; // repeated definition
1212
const absoluteFilePath = 'core/pluginExports.js';
1313
api.writeTmpFile({
1414
path: absoluteFilePath,
1515
content: `${fesExports
16-
.map(item => generateExports(absoluteFilePath, {
17-
item,
18-
fesExportsHook
19-
}))
20-
.join('\n')}\n`
16+
.map((item) =>
17+
generateExports(absoluteFilePath, {
18+
item,
19+
fesExportsHook,
20+
}),
21+
)
22+
.join('\n')}\n`,
2123
});
2224
});
2325
}

packages/fes-preset-built-in/src/plugins/generateFiles/core/plugin/index.js renamed to packages/fes-preset-built-in/src/plugins/core/plugin/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { readFileSync } from 'fs';
22
import { join } from 'path';
33
import { winPath } from '@fesjs/utils';
4-
import { runtimePath } from '../../../../utils/constants';
4+
import { runtimePath } from '../../../utils/constants';
55

66
export default function (api) {
77
const {

packages/fes-preset-built-in/src/plugins/route/index.js renamed to packages/fes-preset-built-in/src/plugins/core/route/index.js

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,15 @@ import { readdirSync, statSync, readFileSync } from 'fs';
22
import { join, extname, basename } from 'path';
33
import { lodash, parser, generator, logger, winPath } from '@fesjs/utils';
44
import { parse } from '@vue/compiler-sfc';
5-
import { runtimePath } from '../../utils/constants';
5+
import { runtimePath } from '../../../utils/constants';
66

77
// pages
88
// ├── index.vue # 根路由页面 路径 /
9-
// ├── *.vue # 模糊匹配 路径 *
9+
// ├── [...slug].vue # 模糊匹配 路径 /:slug(.*)
1010
// ├── a.vue # 路径 /a
1111
// ├── b
1212
// │ ├── index.vue # 路径 /b
13-
// │ ├── @id.vue # 动态路由 /b/:id
13+
// │ ├── [slug].vue # 动态路由 /b/:slug
1414
// │ └── c.vue # 路径 /b/c
1515
// └── layout.vue # 根路由下所有page共用的外层
1616

@@ -38,7 +38,14 @@ const checkHasLayout = function (path) {
3838

3939
const getRouteName = function (parentRoutePath, fileName) {
4040
const routeName = winPath(join(parentRoutePath, fileName));
41-
return routeName.slice(1).replace(/\//g, '_').replace(/@/g, '_').replace(/:/g, '_').replace(/\*/g, 'FUZZYMATCH');
41+
return routeName
42+
.slice(1)
43+
.replace(/\//g, '_')
44+
.replace(/@/g, '_')
45+
.replace(/:/g, '_')
46+
.replace(/\*/g, 'FUZZYMATCH')
47+
.replace(/\[([a-zA-Z]+)\]/, '_$1')
48+
.replace(/\[...([a-zA-Z]*)\]/, 'FUZZYMATCH-$1');
4249
};
4350

4451
const getRoutePath = function (parentRoutePath, fileName, isFile = true) {
@@ -48,12 +55,22 @@ const getRoutePath = function (parentRoutePath, fileName, isFile = true) {
4855
}
4956
// /@id.vue -> /:id
5057
if (fileName.startsWith('@')) {
58+
logger.warn(`[WARNING]: ${fileName} is deprecated, please use [slug]`);
5159
fileName = fileName.replace(/@/, ':');
5260
}
5361
// /*.vue -> :pathMatch(.*)
5462
if (fileName.includes('*')) {
63+
logger.warn(`[WARNING]: ${fileName} is deprecated, please use [...slug]`);
5564
fileName = fileName.replace('*', ':pathMatch(.*)');
5665
}
66+
// /[slug].vue -> /:slug
67+
if (/\[[a-zA-Z]+\]/.test(fileName)) {
68+
fileName = fileName.replace(/\[([a-zA-Z]+)\]/g, ':$1');
69+
}
70+
// /[...slug].vue -> /:slug(.*)
71+
if (/\[...[a-zA-Z]*\]/.test(fileName)) {
72+
fileName = fileName.replace(/\[...([a-zA-Z]*)\]/, ':$1(.*)').replace(':(.*)', ':pathMatch(.*)');
73+
}
5774
return winPath(join(parentRoutePath, fileName));
5875
};
5976

@@ -75,7 +92,7 @@ function getRouteMeta(content) {
7592
const fn = eval(`() => (${argument.code})`);
7693
return fn();
7794
}
78-
} catch (err) { }
95+
} catch (err) {}
7996
return null;
8097
}
8198

@@ -186,9 +203,9 @@ const rank = function (routes) {
186203
let count = 0;
187204
arr.forEach((sonPath) => {
188205
count += 4;
189-
if (sonPath.indexOf(':') !== -1 && sonPath.indexOf(':pathMatch(.*)') === -1) {
206+
if (sonPath.indexOf(':') !== -1 && sonPath.indexOf('(.*)') === -1) {
190207
count += 2;
191-
} else if (sonPath.indexOf(':pathMatch(.*)') !== -1) {
208+
} else if (sonPath.indexOf('(.*)') !== -1) {
192209
count -= 1;
193210
} else if (sonPath === '') {
194211
count += 1;

packages/fes-preset-built-in/src/plugins/generateFiles/genType.js

Lines changed: 0 additions & 33 deletions
This file was deleted.
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,41 @@
11
import { name } from '../../package.json';
22

3+
function importsToStr(imports) {
4+
return imports.map((imp) => {
5+
const { source } = imp;
6+
return `export * from '${source}';`;
7+
});
8+
}
9+
10+
function genTypeContent(imports) {
11+
return {
12+
imports: importsToStr(imports).join('\n'),
13+
};
14+
}
15+
316
export default function (api) {
17+
const {
18+
utils: { Mustache },
19+
} = api;
20+
421
api.addConfigType(() => ({
522
source: name,
623
runtime: ['InnerRuntimeConfig'],
724
build: ['InnerBuildConfig'],
825
}));
26+
27+
api.onGenerateFiles(async () => {
28+
const typeTpl = `
29+
{{{ imports }}}
30+
`;
31+
const importSources = await api.applyPlugins({
32+
key: 'addConfigType',
33+
type: api.ApplyPluginsType.add,
34+
initialValue: [],
35+
});
36+
api.writeTmpFile({
37+
path: 'configType.d.ts',
38+
content: Mustache.render(typeTpl, genTypeContent(importSources)),
39+
});
40+
});
941
}

0 commit comments

Comments
 (0)