prepare:types
The prepare:types hook is used by Nuxt Umbu to configure TypeScript types and module references, ensuring full IDE support and type safety.
Overview
This hook runs during Nuxt's TypeScript preparation phase and is responsible for:
- Generating type definitions for the auth instance
- Adding type references to the TypeScript project
- Configuring path aliases for module imports
- Ensuring IDE autocomplete works correctly
What It Does
1. Type Reference Registration
The hook adds the generated umbu.d.ts file to TypeScript references:
nuxt.hook('prepare:types', ({ references, tsConfig }) => {
references.push({ path: umbuTypes.dst })
})
This ensures TypeScript includes the generated types in your project.
2. Path Alias Configuration
The hook configures TypeScript compiler options to recognize module aliases:
tsConfig.compilerOptions.paths['#auth-utils'] = [runtimeUtilsPath]
tsConfig.compilerOptions.paths['#auth-types'] = [runtimeTypesPath]
This allows you to import from these aliases with full type support:
import { someHelper } from '#auth-utils'
import type { AuthInstance } from '#auth-types'
3. Provider-Specific Types
The hook ensures the correct type definitions are loaded based on your configured provider:
- Sanctum: Cookie-based authentication types
- Passport: Token-based authentication types
Generated Types
The hook triggers the generation of umbu.d.ts which includes:
AuthInstanceinterface with all auth methods- Provider-specific type definitions
- Configuration option types
- State management types
Usage
No manual usage is required - the hook runs automatically during the build process. However, you can benefit from its effects:
IDE Autocomplete
const { $auth } = useNuxtApp()
// Full autocomplete available
$auth.loginWith('passport', { /* ... */ })
$auth.logout('passport')
Type-Safe Imports
// Type-safe imports with aliases
import { useAuthStore } from '#auth-utils'
import type { ModuleOptions } from '#auth-types'
Configuration
The hook behavior is controlled by your module configuration:
// nuxt.config.ts
export default defineNuxtConfig({
auth: {
provider: 'sanctum', // or 'passport'
// ... other options
}
})
The hook automatically adapts to your provider choice.
Notes
- The hook runs during Nuxt's build process
- Generated types are located in
.nuxt/types/umbu.d.ts - Changes to module configuration require a rebuild to update types
- The hook is essential for TypeScript support in Nuxt Umbu