nuxt-typed-router 1.1.0 โ 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -3
- package/dist/module.json +1 -1
- package/dist/module.mjs +22 -34
- package/package.json +6 -18
package/README.md
CHANGED
|
@@ -18,6 +18,9 @@
|
|
|
18
18
|
- ๐ฆ Provides auto-completion and errors for route params in `push` and `replace` methods
|
|
19
19
|
|
|
20
20
|
<br/>
|
|
21
|
+
|
|
22
|
+
Demo ๐งช : [nuxt-typed-router-demo](https://github.com/victorgarciaesgi/nuxt-typed-router-demo)
|
|
23
|
+
|
|
21
24
|
<br/>
|
|
22
25
|
<p align="center">
|
|
23
26
|
<img src="https://github.com/victorgarciaesgi/nuxt-typed-router/blob/master/medias/in-action.gif?raw=true"/>
|
|
@@ -86,8 +89,6 @@ The module will generate 4 files each time you modify the `pages` folder :
|
|
|
86
89
|
|
|
87
90
|
# Usage in Vue/Nuxt
|
|
88
91
|
|
|
89
|
-
## Check out this demo and clone it! [nuxt-typed-router-demo](https://github.com/victorgarciaesgi/nuxt-typed-router-demo)
|
|
90
|
-
|
|
91
92
|
<br/>
|
|
92
93
|
|
|
93
94
|
### **_Requirements_**
|
|
@@ -156,7 +157,7 @@ export type TypedRouteList =
|
|
|
156
157
|
|
|
157
158
|
# Usage with `useTypedRouter` hook
|
|
158
159
|
|
|
159
|
-
`useTypedRouter` is an exported composable from nuxt-typed-router. It contains a clone of `vue-router` but with
|
|
160
|
+
`useTypedRouter` is an exported composable from nuxt-typed-router. It contains a clone of `vue-router` but with strictly typed route names and params type-check
|
|
160
161
|
|
|
161
162
|
```vue
|
|
162
163
|
<script lang="ts">
|
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { extendPages, defineNuxtModule } from '@nuxt/kit';
|
|
2
|
-
import { fileURLToPath } from 'url';
|
|
3
2
|
import chalk from 'chalk';
|
|
4
3
|
import logSymbols from 'log-symbols';
|
|
5
|
-
import { resolve, dirname } from 'pathe';
|
|
6
4
|
import prettier from 'prettier';
|
|
7
5
|
import fs from 'fs';
|
|
6
|
+
import { fileURLToPath } from 'url';
|
|
7
|
+
import { dirname, resolve } from 'pathe';
|
|
8
8
|
import mkdirp from 'mkdirp';
|
|
9
9
|
import { camelCase } from 'lodash-es';
|
|
10
10
|
|
|
@@ -35,9 +35,11 @@ async function formatOutputWithPrettier(template) {
|
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
37
|
|
|
38
|
-
|
|
38
|
+
dirname(fileURLToPath(import.meta.url));
|
|
39
|
+
async function saveRouteFiles(outDir, srcDir, fileName, content) {
|
|
39
40
|
try {
|
|
40
|
-
const
|
|
41
|
+
const processedOutDir = resolve(srcDir, outDir);
|
|
42
|
+
const outputFile = resolve(process.cwd(), `${processedOutDir}/${fileName}`);
|
|
41
43
|
const formatedContent = await formatOutputWithPrettier(content);
|
|
42
44
|
if (fs.existsSync(outputFile)) {
|
|
43
45
|
await writeFile(outputFile, formatedContent);
|
|
@@ -128,14 +130,16 @@ function startGeneratorProcedure({
|
|
|
128
130
|
output,
|
|
129
131
|
routesConfig
|
|
130
132
|
}) {
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
133
|
+
routesConfig.forEach((route, index) => {
|
|
134
|
+
const rootSiblingsRoutes = routesConfig.filter((rt) => rt.chunkName !== route.chunkName);
|
|
135
|
+
walkThoughRoutes({
|
|
136
|
+
route,
|
|
137
|
+
level: 0,
|
|
138
|
+
output,
|
|
139
|
+
siblings: rootSiblingsRoutes,
|
|
140
|
+
isLast: isItemLast(routesConfig, index)
|
|
141
|
+
});
|
|
142
|
+
});
|
|
139
143
|
output.routesObjectTemplate += "}";
|
|
140
144
|
output.routesDeclTemplate += "}";
|
|
141
145
|
}
|
|
@@ -207,15 +211,6 @@ import type {
|
|
|
207
211
|
RouteQueryAndHash,
|
|
208
212
|
} from 'vue-router';
|
|
209
213
|
import type { TypedRouteList } from './__routes'
|
|
210
|
-
|
|
211
|
-
// -- Unbuild CommonJS Shims --
|
|
212
|
-
import __cjs_url__ from 'url';
|
|
213
|
-
import __cjs_path__ from 'path';
|
|
214
|
-
import __cjs_mod__ from 'module';
|
|
215
|
-
const __filename = __cjs_url__.fileURLToPath(import.meta.url);
|
|
216
|
-
const __dirname = __cjs_path__.dirname(__filename);
|
|
217
|
-
const require = __cjs_mod__.createRequire(import.meta.url);
|
|
218
|
-
|
|
219
214
|
`;
|
|
220
215
|
const staticDeclarations = `
|
|
221
216
|
type TypedRouteParamsStructure = {
|
|
@@ -390,24 +385,21 @@ function createTypedRouteParamsExport(routesParams) {
|
|
|
390
385
|
}`;
|
|
391
386
|
}
|
|
392
387
|
|
|
393
|
-
const __dirname = dirname(fileURLToPath(import.meta.url));
|
|
394
388
|
function routeHook(outDir, routesObjectName, srcDir, nuxt) {
|
|
395
389
|
try {
|
|
396
390
|
extendPages(async (routes) => {
|
|
397
391
|
if (routes.length) {
|
|
398
392
|
const { routesDeclTemplate, routesList, routesObjectTemplate, routesParams } = constructRouteMap(routes);
|
|
399
393
|
const pluginName = "__typed-router.ts";
|
|
400
|
-
const runtimeDir = resolve(__dirname, process.env.NUXT_BUILD_TYPE === "stub" ? "../../dist/runtime" : "./runtime");
|
|
401
|
-
const pluginPath = resolve(runtimeDir, pluginName);
|
|
402
394
|
nuxt.hook("build:done", async () => {
|
|
403
395
|
const pluginFolder = `${srcDir}/plugins`;
|
|
404
|
-
await saveRouteFiles(pluginFolder, pluginName, createRuntimePluginFile(routesDeclTemplate));
|
|
396
|
+
await saveRouteFiles(pluginFolder, srcDir, pluginName, createRuntimePluginFile(routesDeclTemplate));
|
|
405
397
|
});
|
|
406
398
|
await Promise.all([
|
|
407
|
-
saveRouteFiles(outDir, "__useTypedRouter.ts", createRuntimeHookFile(routesDeclTemplate)),
|
|
408
|
-
saveRouteFiles(outDir, `__routes.ts`, createRuntimeRoutesFile({ routesList, routesObjectTemplate, routesObjectName })),
|
|
409
|
-
saveRouteFiles(outDir, `typed-router.d.ts`, createDeclarationRoutesFile({ routesDeclTemplate, routesList, routesParams })),
|
|
410
|
-
saveRouteFiles(outDir, "index.ts", createRuntimeIndexFile())
|
|
399
|
+
saveRouteFiles(outDir, srcDir, "__useTypedRouter.ts", createRuntimeHookFile(routesDeclTemplate)),
|
|
400
|
+
saveRouteFiles(outDir, srcDir, `__routes.ts`, createRuntimeRoutesFile({ routesList, routesObjectTemplate, routesObjectName })),
|
|
401
|
+
saveRouteFiles(outDir, srcDir, `typed-router.d.ts`, createDeclarationRoutesFile({ routesDeclTemplate, routesList, routesParams })),
|
|
402
|
+
saveRouteFiles(outDir, srcDir, "index.ts", createRuntimeIndexFile())
|
|
411
403
|
]);
|
|
412
404
|
console.log(logSymbols.success, `[typed-router] Routes definitions generated`);
|
|
413
405
|
} else {
|
|
@@ -425,13 +417,9 @@ const module = defineNuxtModule({
|
|
|
425
417
|
configKey: "nuxtTypedRouter",
|
|
426
418
|
compatibility: { nuxt: "^3.0.0", bridge: false }
|
|
427
419
|
},
|
|
428
|
-
defaults: {
|
|
429
|
-
routesObjectName: "routerPagesNames",
|
|
430
|
-
stripAtFromName: false
|
|
431
|
-
},
|
|
432
420
|
setup(moduleOptions, nuxt) {
|
|
433
421
|
const srcDir = nuxt.options.srcDir;
|
|
434
|
-
const { outDir =
|
|
422
|
+
const { outDir = `./generated`, routesObjectName = "routerPagesNames" } = moduleOptions;
|
|
435
423
|
nuxt.hook("pages:extend", () => routeHook(outDir, routesObjectName, srcDir, nuxt));
|
|
436
424
|
routeHook(outDir, routesObjectName, srcDir, nuxt);
|
|
437
425
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "nuxt-typed-router",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "Provide autocompletion for pages route names generated by Nuxt router",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
@@ -9,9 +9,9 @@
|
|
|
9
9
|
"prepack": "nuxt-module-build",
|
|
10
10
|
"build:local": "nuxt-module-build --stub && cross-env NUXT_BUILD_TYPE=stub nuxi dev playground",
|
|
11
11
|
"init:build": "nuxt-module-build --stub && nuxi prepare playground",
|
|
12
|
-
"build:test": "cross-env NUXT_BUILD_TYPE=stub yarn
|
|
13
|
-
"test": "yarn build:test &&
|
|
14
|
-
"test:
|
|
12
|
+
"build:test": "cross-env NUXT_BUILD_TYPE=stub yarn prepack && yarn play:build",
|
|
13
|
+
"test": "yarn build:test && vitest run",
|
|
14
|
+
"test:watch": "yarn build:test && vitest"
|
|
15
15
|
},
|
|
16
16
|
"exports": {
|
|
17
17
|
".": {
|
|
@@ -60,31 +60,19 @@
|
|
|
60
60
|
"prettier": "^2.5.1"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
|
-
"@babel/plugin-transform-runtime": "^7.16.10",
|
|
64
|
-
"@babel/preset-env": "^7.16.11",
|
|
65
63
|
"@nuxt/module-builder": "latest",
|
|
66
|
-
"@nuxt/test-utils": "^0.2.2",
|
|
67
64
|
"@nuxt/types": "^2.15.8",
|
|
68
65
|
"@nuxtjs/eslint-config-typescript": "latest",
|
|
69
|
-
"@types/
|
|
70
|
-
"@types/lodash": "^4.14.178",
|
|
66
|
+
"@types/lodash-es": "^4.14.178",
|
|
71
67
|
"@types/mkdirp": "^1.0.2",
|
|
72
68
|
"@types/node": "^16.11.12",
|
|
73
69
|
"@types/prettier": "^2.4.3",
|
|
74
|
-
"babel-jest": "^27.4.6",
|
|
75
|
-
"copyfiles": "^2.4.0",
|
|
76
|
-
"core-js": "^3.20.3",
|
|
77
70
|
"cross-env": "^7.0.3",
|
|
78
71
|
"eslint": "8.8.0",
|
|
79
72
|
"eslint-config-prettier": "^8.3.0",
|
|
80
|
-
"jest": "^27.4.7",
|
|
81
73
|
"nuxt3": "latest",
|
|
82
|
-
"path": "^0.12.7",
|
|
83
|
-
"playwright": "^1.18.1",
|
|
84
|
-
"rimraf": "^3.0.2",
|
|
85
|
-
"ts-jest": "^27.1.3",
|
|
86
74
|
"typescript": "^4.5.1",
|
|
87
|
-
"
|
|
75
|
+
"vitest": "^0.2.5",
|
|
88
76
|
"vue-router": "^4.0.12"
|
|
89
77
|
}
|
|
90
78
|
}
|