fix: broken type augmenting

Fixes #570

Author: harlan-zw

package.json

@@ -54,7 +54,7 @@
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
     "test": "pnpm dev:prepare && vitest --run",
-    "test:types": "echo 'broken due to type regeneration, use pnpm typecheck' && npx nuxi typecheck"
+    "test:types": "vitest run --project typecheck"
   },
   "build": {
     "externals": [

src/module.ts

@@ -2,7 +2,8 @@ import {
   addBuildPlugin,
   addComponentsDir,
   addImports,
-  addPluginTemplate, addTemplate, addTypeTemplate,
+  addPluginTemplate,
+  addTemplate,
   createResolver,
   defineNuxtModule,
   hasNuxtModule,
@@ -24,8 +25,7 @@ import type {
   RegistryScripts,
 } from './runtime/types'
 import { NuxtScriptsCheckScripts } from './plugins/check-scripts'
-import { templatePlugin, templateTriggerResolver } from './templates'
-import { relative, resolve } from 'pathe'
+import { registerTypeTemplates, templatePlugin, templateTriggerResolver } from './templates'
 
 export interface ModuleOptions {
   /**
@@ -201,42 +201,7 @@ export default defineNuxtModule<ModuleOptions>({
       const registryScriptsWithImport = registryScripts.filter(i => !!i.import?.name) as Required<RegistryScript>[]
       const newScripts = registryScriptsWithImport.filter(i => !scripts.some(r => r.import?.name === i.import.name))
 
-      addTypeTemplate({
-        filename: 'module/nuxt-scripts.d.ts',
-        getContents: (data) => {
-          const typesPath = relative(resolve(data.nuxt!.options.rootDir, data.nuxt!.options.buildDir, 'module'), resolve('runtime/types'))
-          let types = `
-declare module '#app' {
-  interface NuxtApp {
-    $scripts: Record<${[...Object.keys(config.globals || {}), ...Object.keys(config.registry || {})].map(k => `'${k}'`).concat(['string']).join(' | ')}, (import('#nuxt-scripts/types').UseScriptContext<any>)>
-    _scripts: Record<string, (import('#nuxt-scripts/types').UseScriptContext<any>)>
-  }
-  interface RuntimeNuxtHooks {
-    'scripts:updated': (ctx: { scripts: Record<string, (import('#nuxt-scripts/types').UseScriptContext<any>)> }) => void | Promise<void>
-  }
-}
-`
-          if (newScripts.length) {
-            types = `${types}
-declare module '#nuxt-scripts/types' {
-    type NuxtUseScriptOptions = Omit<import('${typesPath}').NuxtUseScriptOptions, 'use' | 'beforeInit'>
-    interface ScriptRegistry {
-${newScripts.map((i) => {
-  const key = i.import?.name.replace('useScript', '')
-  const keyLcFirst = key.substring(0, 1).toLowerCase() + key.substring(1)
-  return `        ${keyLcFirst}?: import('${i.import?.from}').${key}Input | [import('${i.import?.from}').${key}Input, NuxtUseScriptOptions]`
-}).join('\n')}
-    }
-}`
-            return types
-          }
-          return `${types}
-export {}`
-        },
-      }, {
-        nuxt: true,
-        node: true,
-      })
+      registerTypeTemplates({ nuxt, config, newScripts })
 
       if (Object.keys(config.globals || {}).length || Object.keys(config.registry || {}).length) {
         // create a virtual plugin

src/templates.ts

@@ -1,8 +1,60 @@
 import { hash } from 'ohash'
+import { relative, resolve } from 'pathe'
+import { addTypeTemplate } from '@nuxt/kit'
+import type { Nuxt } from '@nuxt/schema'
 import type { ModuleOptions } from './module'
 import { logger } from './logger'
 import type { RegistryScript } from '#nuxt-scripts/types'
 
+interface TypeTemplateContext {
+  nuxt: Nuxt
+  config: ModuleOptions
+  newScripts: Required<RegistryScript>[]
+}
+
+export function registerTypeTemplates({ nuxt, config, newScripts }: TypeTemplateContext) {
+  // Type augmentations for existing modules (#app, #nuxt-scripts/types)
+  addTypeTemplate({
+    filename: 'types/nuxt-scripts-augments.d.ts',
+    getContents: () => {
+      const typesPath = relative(
+        resolve(nuxt.options.rootDir, nuxt.options.buildDir, 'types'),
+        resolve('runtime/types'),
+      )
+
+      let augments = `// Generated by @nuxt/scripts
+declare module '#app' {
+  interface NuxtApp {
+    $scripts: Record<${[...Object.keys(config.globals || {}), ...Object.keys(config.registry || {})].map(k => `'${k}'`).concat(['string']).join(' | ')}, import('#nuxt-scripts/types').UseScriptContext<any>>
+    _scripts: Record<string, import('#nuxt-scripts/types').UseScriptContext<any>>
+  }
+  interface RuntimeNuxtHooks {
+    'scripts:updated': (ctx: { scripts: Record<string, import('#nuxt-scripts/types').UseScriptContext<any>> }) => void | Promise<void>
+  }
+}
+`
+
+      if (newScripts.length) {
+        augments += `
+declare module '#nuxt-scripts/types' {
+  type _NuxtScriptOptions = Omit<import('${typesPath}').NuxtUseScriptOptions, 'use' | 'beforeInit'>
+  interface ScriptRegistry {
+${newScripts.map((i) => {
+  const key = i.import.name.replace('useScript', '')
+  const keyLcFirst = key.substring(0, 1).toLowerCase() + key.substring(1)
+  return `    ${keyLcFirst}?: import('${i.import.from}').${key}Input | [import('${i.import.from}').${key}Input, _NuxtScriptOptions]`
+}).join('\n')}
+  }
+}
+`
+      }
+
+      return `${augments}
+export {}`
+    },
+  }, { nuxt: true })
+}
+
 export function templateTriggerResolver(defaultScriptOptions?: ModuleOptions['defaultScriptOptions']) {
   const needsIdleTimeout = defaultScriptOptions?.trigger && typeof defaultScriptOptions.trigger === 'object' && 'idleTimeout' in defaultScriptOptions.trigger
   const needsInteraction = defaultScriptOptions?.trigger && typeof defaultScriptOptions.trigger === 'object' && 'interaction' in defaultScriptOptions.trigger

test/fixtures/extend-registry/scripts/my-custom-script.ts

@@ -1,5 +1,11 @@
 import { useRegistryScript } from '#nuxt-scripts/utils'
 
+declare global {
+  interface Window {
+    myScript: () => void
+  }
+}
+
 export interface CustomApi {
   myScript: () => void
 }

test/types/extend-registry.test-d.ts

@@ -0,0 +1,34 @@
+import { describe, expectTypeOf, it } from 'vitest'
+
+// Import from the generated augments file to test it's a valid module
+// This tests the fix for issue #570 - the file must have `export {}`
+// to be treated as a module, otherwise the augmentations break base exports
+import type {} from '../../test/fixtures/extend-registry/.nuxt/types/nuxt-scripts-augments'
+
+// Import base types to verify they're still accessible after augmentation
+import type {
+  NuxtUseScriptOptions,
+  ScriptRegistry,
+  UseScriptContext,
+} from '../../src/runtime/types'
+
+// Issue #570: When adding a new script to registry via hooks, the generated
+// nuxt-scripts-augments.d.ts was missing `export {}`, causing TypeScript to
+// treat it as a script instead of a module. This broke imports from
+// #nuxt-scripts/types because the module augmentation interfered with
+// the original module's exports.
+describe('extend-registry fixture types (issue #570)', () => {
+  it('base types remain accessible after augmentation', () => {
+    // The core issue in #570 was that after augmentation, the base exports
+    // from #nuxt-scripts/types became inaccessible
+    expectTypeOf<UseScriptContext<{ foo: string }>>().not.toBeAny()
+    expectTypeOf<NuxtUseScriptOptions>().not.toBeAny()
+    expectTypeOf<ScriptRegistry>().not.toBeAny()
+  })
+
+  it('ScriptRegistry maintains known properties', () => {
+    // Ensure base registry entries still work
+    expectTypeOf<ScriptRegistry>().toHaveProperty('googleAnalytics')
+    expectTypeOf<ScriptRegistry>().toHaveProperty('clarity')
+  })
+})

test/types/types.test-d.ts

@@ -1,9 +1,50 @@
 import { describe, expectTypeOf, it } from 'vitest'
 import type { ModuleOptions } from '../../src/module'
-import type { ScriptRegistry } from '../../src/runtime/types'
+import type {
+  NuxtUseScriptOptions,
+  RegistryScriptInput,
+  ScriptRegistry,
+  UseScriptContext,
+} from '../../src/runtime/types'
 
-describe('module options registry', async () => {
-  it('expect no any', async () => {
-    expectTypeOf<NonNullable<NonNullable<ModuleOptions>['registry']>[keyof ScriptRegistry]>().not.toBeAny()
+describe('module options registry', () => {
+  it('registry entries are typed', () => {
+    // Check specific registry keys have proper types (not any)
+    // Using specific keys because the index signature `[key: \`${string}-npm\`]`
+    // causes `keyof ScriptRegistry` to include template literals which resolve to any
+    type Registry = NonNullable<ModuleOptions['registry']>
+    expectTypeOf<Registry['googleAnalytics']>().not.toBeAny()
+    expectTypeOf<Registry['clarity']>().not.toBeAny()
+    expectTypeOf<Registry['stripe']>().not.toBeAny()
+  })
+})
+
+// Issue #570: Verify #nuxt-scripts/types exports are available
+// When adding new scripts to registry, the type definitions were broken
+// because `export {}` was missing from the generated .d.ts file
+describe('#nuxt-scripts/types exports', () => {
+  it('exports UseScriptContext type', () => {
+    expectTypeOf<UseScriptContext<{ foo: string }>>().not.toBeAny()
+    expectTypeOf<UseScriptContext<{ foo: string }>>().toBeObject()
+  })
+
+  it('exports NuxtUseScriptOptions type', () => {
+    expectTypeOf<NuxtUseScriptOptions>().not.toBeAny()
+    expectTypeOf<NuxtUseScriptOptions>().toBeObject()
+  })
+
+  it('exports RegistryScriptInput type', () => {
+    expectTypeOf<RegistryScriptInput>().not.toBeAny()
+  })
+
+  it('exports ScriptRegistry interface', () => {
+    expectTypeOf<ScriptRegistry>().not.toBeAny()
+    expectTypeOf<ScriptRegistry>().toBeObject()
+  })
+
+  it('ScriptRegistry has known keys', () => {
+    expectTypeOf<ScriptRegistry>().toHaveProperty('googleAnalytics')
+    expectTypeOf<ScriptRegistry>().toHaveProperty('googleTagManager')
+    expectTypeOf<ScriptRegistry>().toHaveProperty('clarity')
   })
 })

vitest.config.ts

@@ -4,6 +4,19 @@ import { defineConfig, defineProject } from 'vitest/config'
 export default defineConfig({
   test: {
     projects: [
+      // type tests using vitest typecheck
+      defineProject({
+        test: {
+          name: 'typecheck',
+          include: [
+            './test/types/**/*.test-d.ts',
+          ],
+          typecheck: {
+            enabled: true,
+            include: ['./test/types/**/*.test-d.ts'],
+          },
+        },
+      }),
       // utils folders as *.test.ts in either test/unit or in src/**/*.test.ts
       defineProject({
         test: {