From 398e8cc234b016ee08eb41802af37e84e3cf4ac3 Mon Sep 17 00:00:00 2001 From: wattanx Date: Sat, 3 Jun 2023 22:47:53 +0900 Subject: [PATCH 1/3] feat: generate middleware types --- packages/bridge/src/app.ts | 6 +++++- packages/bridge/src/type-templates.ts | 20 +++++++++++++++++++- playground/middleware/inject-auth.js | 5 +++++ playground/pages/auth.vue | 5 +++++ playground/pages/secret.vue | 8 ++++++++ test/bridge.test.ts | 10 ++++++++++ 6 files changed, 52 insertions(+), 2 deletions(-) create mode 100644 playground/middleware/inject-auth.js create mode 100644 playground/pages/auth.vue create mode 100644 playground/pages/secret.vue diff --git a/packages/bridge/src/app.ts b/packages/bridge/src/app.ts index 28eeea04..d42a162a 100644 --- a/packages/bridge/src/app.ts +++ b/packages/bridge/src/app.ts @@ -2,7 +2,7 @@ import { useNuxt, addTemplate, resolveAlias, addWebpackPlugin, addVitePlugin, ad import { NuxtModule } from '@nuxt/schema' import { normalize, resolve } from 'pathe' import { resolveImports } from 'mlly' -import { componentsTypeTemplate, schemaTemplate } from './type-templates' +import { componentsTypeTemplate, schemaTemplate, middlewareTypeTemplate } from './type-templates' import { distDir } from './dirs' import { VueCompat } from './vue-compat' @@ -57,8 +57,12 @@ export async function setupAppBridge (_options: any) { ...componentsTypeTemplate, options: { components, buildDir: nuxt.options.buildDir } }) + + addTemplate(middlewareTypeTemplate) + nuxt.hook('prepare:types', ({ references }) => { references.push({ path: resolve(nuxt.options.buildDir, 'types/components.d.ts') }) + references.push({ path: resolve(nuxt.options.buildDir, 'types/middleware.d.ts') }) }) // Augment schema with module types diff --git a/packages/bridge/src/type-templates.ts b/packages/bridge/src/type-templates.ts index 5013db0c..dd0d63a4 100644 --- a/packages/bridge/src/type-templates.ts +++ b/packages/bridge/src/type-templates.ts @@ -28,9 +28,27 @@ export const componentNames: string[] } } +export const middlewareTypeTemplate = { + filename: 'types/middleware.d.ts', + getContents: ({ app }: TemplateContext) => { + const middleware = app.templateVars.middleware + + return [ + 'import type { NavigationGuard } from \'vue-router\'', + `export type MiddlewareKey = ${middleware.map(mw => genString(mw.name)).join(' | ') || 'string'}`, + `declare module \'vue/types/options\' {`, + ' export type Middleware = MiddlewareKey | NavigationGuard | Array', + ' interface ComponentOptions {', + ' middleware?: Middleware | Middleware[]', + ' }', + '}' + ].join('\n') + } +} + interface TemplateContext { nuxt: Nuxt - app: NuxtApp + app: NuxtApp & { templateVars: Record } } const adHocModules = ['router', 'pages', 'auto-imports', 'meta', 'components'] diff --git a/playground/middleware/inject-auth.js b/playground/middleware/inject-auth.js new file mode 100644 index 00000000..79826933 --- /dev/null +++ b/playground/middleware/inject-auth.js @@ -0,0 +1,5 @@ +import { defineNuxtRouteMiddleware } from "#app" + +export default defineNuxtRouteMiddleware(({ redirect }) => { + redirect('/auth') +}) diff --git a/playground/pages/auth.vue b/playground/pages/auth.vue new file mode 100644 index 00000000..c4664412 --- /dev/null +++ b/playground/pages/auth.vue @@ -0,0 +1,5 @@ + diff --git a/playground/pages/secret.vue b/playground/pages/secret.vue new file mode 100644 index 00000000..d8103722 --- /dev/null +++ b/playground/pages/secret.vue @@ -0,0 +1,8 @@ + + diff --git a/test/bridge.test.ts b/test/bridge.test.ts index 262abd68..61c9a02b 100644 --- a/test/bridge.test.ts +++ b/test/bridge.test.ts @@ -89,6 +89,16 @@ describe('route rules', () => { }) }) +describe('middleware', () => { + // TODO: middleware does not work with vite + it.skipIf(!isWebpack)('should navigate to auth', async () => { + const html = await $fetch('/secret') + + expect(html).toContain('auth.vue') + expect(html).not.toContain('navigate to auth') + }) +}) + describe('dynamic paths', () => { if (process.env.NUXT_TEST_DEV) { // TODO: From 097d89b8fd0ba69417453482935161a3570dd887 Mon Sep 17 00:00:00 2001 From: wattanx Date: Sat, 3 Jun 2023 22:58:17 +0900 Subject: [PATCH 2/3] fix: lint fix --- packages/bridge-schema/src/config/index.ts | 1 - packages/bridge/src/app.ts | 4 ++-- packages/bridge/src/runtime/app.ts | 1 - packages/bridge/src/type-templates.ts | 15 +++++++-------- playground/middleware/inject-auth.js | 2 +- 5 files changed, 10 insertions(+), 13 deletions(-) diff --git a/packages/bridge-schema/src/config/index.ts b/packages/bridge-schema/src/config/index.ts index 1a3fcc6c..c32bf907 100644 --- a/packages/bridge-schema/src/config/index.ts +++ b/packages/bridge-schema/src/config/index.ts @@ -1,4 +1,3 @@ - import app from './app' import build from './build' import cli from './cli' diff --git a/packages/bridge/src/app.ts b/packages/bridge/src/app.ts index d42a162a..ca1cb9f8 100644 --- a/packages/bridge/src/app.ts +++ b/packages/bridge/src/app.ts @@ -57,9 +57,9 @@ export async function setupAppBridge (_options: any) { ...componentsTypeTemplate, options: { components, buildDir: nuxt.options.buildDir } }) - + addTemplate(middlewareTypeTemplate) - + nuxt.hook('prepare:types', ({ references }) => { references.push({ path: resolve(nuxt.options.buildDir, 'types/components.d.ts') }) references.push({ path: resolve(nuxt.options.buildDir, 'types/middleware.d.ts') }) diff --git a/packages/bridge/src/runtime/app.ts b/packages/bridge/src/runtime/app.ts index 9975e174..cc873975 100644 --- a/packages/bridge/src/runtime/app.ts +++ b/packages/bridge/src/runtime/app.ts @@ -1,4 +1,3 @@ - import type { NuxtAppCompat } from '@nuxt/bridge-schema' import { defineComponent, getCurrentInstance } from './composables' export const isVue2 = true diff --git a/packages/bridge/src/type-templates.ts b/packages/bridge/src/type-templates.ts index dd0d63a4..cebcebc7 100644 --- a/packages/bridge/src/type-templates.ts +++ b/packages/bridge/src/type-templates.ts @@ -1,4 +1,3 @@ - import { isAbsolute, relative, join } from 'pathe' import type { Component, Nuxt, NuxtApp } from '@nuxt/schema' import { genDynamicImport, genString } from 'knitwork' @@ -10,6 +9,11 @@ type ComponentsTemplateOptions = { components: Component[] } +interface TemplateContext { + nuxt: Nuxt + app: NuxtApp & { templateVars: Record } +} + export const componentsTypeTemplate = { filename: 'types/components.d.ts', getContents: ({ options }: { options: ComponentsTemplateOptions }) => { @@ -32,11 +36,11 @@ export const middlewareTypeTemplate = { filename: 'types/middleware.d.ts', getContents: ({ app }: TemplateContext) => { const middleware = app.templateVars.middleware - + return [ 'import type { NavigationGuard } from \'vue-router\'', `export type MiddlewareKey = ${middleware.map(mw => genString(mw.name)).join(' | ') || 'string'}`, - `declare module \'vue/types/options\' {`, + 'declare module \'vue/types/options\' {', ' export type Middleware = MiddlewareKey | NavigationGuard | Array', ' interface ComponentOptions {', ' middleware?: Middleware | Middleware[]', @@ -46,11 +50,6 @@ export const middlewareTypeTemplate = { } } -interface TemplateContext { - nuxt: Nuxt - app: NuxtApp & { templateVars: Record } -} - const adHocModules = ['router', 'pages', 'auto-imports', 'meta', 'components'] export const schemaTemplate = { filename: 'types/schema.d.ts', diff --git a/playground/middleware/inject-auth.js b/playground/middleware/inject-auth.js index 79826933..eeac7a52 100644 --- a/playground/middleware/inject-auth.js +++ b/playground/middleware/inject-auth.js @@ -1,4 +1,4 @@ -import { defineNuxtRouteMiddleware } from "#app" +import { defineNuxtRouteMiddleware } from '#app' export default defineNuxtRouteMiddleware(({ redirect }) => { redirect('/auth') From 94fe1b8c096758ee3c1112963eaf39ad7903ede3 Mon Sep 17 00:00:00 2001 From: wattanx Date: Wed, 21 Jun 2023 15:54:23 +0900 Subject: [PATCH 3/3] fix: return to nuxt 2 style --- packages/bridge/src/type-templates.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/bridge/src/type-templates.ts b/packages/bridge/src/type-templates.ts index cebcebc7..af8223a5 100644 --- a/packages/bridge/src/type-templates.ts +++ b/packages/bridge/src/type-templates.ts @@ -38,10 +38,10 @@ export const middlewareTypeTemplate = { const middleware = app.templateVars.middleware return [ - 'import type { NavigationGuard } from \'vue-router\'', + 'import type { NuxtAppCompat } from \'@nuxt/bridge-schema\'', `export type MiddlewareKey = ${middleware.map(mw => genString(mw.name)).join(' | ') || 'string'}`, 'declare module \'vue/types/options\' {', - ' export type Middleware = MiddlewareKey | NavigationGuard | Array', + ' export type Middleware = MiddlewareKey | ((ctx: NuxtAppCompat, cb: Function) => Promise | void)', ' interface ComponentOptions {', ' middleware?: Middleware | Middleware[]', ' }',