Fix: Template Not Found in Nuxt

What Causes This Error?

This error occurs when Nuxt is configured to use a template file that doesn’t exist or can’t be resolved. Templates are used by modules to generate code at build time.

The Problem

// modules/my-module.ts
import { addTemplate } from '@nuxt/kit'

export default defineNuxtModule({
  setup() {
    // ❌ Wrong - file doesn't exist
    addTemplate({
      filename: 'my-template.ts',
      src: './templates/nonexistent.ts'
    })
  }
})

The Fix

Ensure Template File Exists

modules/
└── my-module/
    ├── index.ts
    └── templates/
        └── my-template.ts   ← Create this file

// modules/my-module/index.ts
import { addTemplate, createResolver } from '@nuxt/kit'

export default defineNuxtModule({
  setup() {
    const resolver = createResolver(import.meta.url)

    // ✅ Correct - use resolver for path
    addTemplate({
      filename: 'my-template.ts',
      src: resolver.resolve('./templates/my-template.ts')
    })
  }
})

Template file:

// modules/my-module/templates/my-template.ts
export const config = {
  name: '<%= options.name %>',
  version: '<%= options.version %>'
}

Using getContents Instead of src

// modules/my-module.ts
import { addTemplate } from '@nuxt/kit'

export default defineNuxtModule({
  setup(options) {
    // ✅ Generate content inline
    addTemplate({
      filename: 'generated-config.ts',
      getContents: () => `
        export const config = {
          name: '${options.name}',
          enabled: ${options.enabled}
        }
      `
    })
  }
})

Common Template Patterns

Configuration File

export default defineNuxtModule({
  setup(options) {
    addTemplate({
      filename: 'my-module/config.ts',
      getContents: () => {
        return `
export default ${JSON.stringify(options, null, 2)}
        `.trim()
      }
    })
  }
})

Type Definitions

export default defineNuxtModule({
  setup(options) {
    addTemplate({
      filename: 'types/my-module.d.ts',
      getContents: () => `
declare module '#my-module' {
  export interface ModuleConfig {
    apiUrl: string
    timeout: number
  }
  export const config: ModuleConfig
}
      `
    })
  }
})

Plugin from Template

export default defineNuxtModule({
  setup(options) {
    const resolver = createResolver(import.meta.url)

    // Add template
    const { dst } = addTemplate({
      filename: 'my-plugin.ts',
      src: resolver.resolve('./templates/plugin.ts'),
      options
    })

    // Use template as plugin
    addPlugin({
      src: dst!
    })
  }
})

Template with EJS

// modules/my-module/templates/plugin.ejs
export default defineNuxtPlugin(() => {
  <% if (options.debug) { %>
  console.log('Debug mode enabled')
  <% } %>

  return {
    provide: {
      myModule: {
        apiUrl: '<%= options.apiUrl %>'
      }
    }
  }
})

// modules/my-module/index.ts
export default defineNuxtModule({
  setup(options) {
    const resolver = createResolver(import.meta.url)

    addTemplate({
      filename: 'my-plugin.ts',
      src: resolver.resolve('./templates/plugin.ejs'),
      options: {
        debug: options.debug,
        apiUrl: options.apiUrl
      }
    })
  }
})

Path Resolution

Correct Path Usage

import { createResolver } from '@nuxt/kit'

export default defineNuxtModule({
  setup() {
    const resolver = createResolver(import.meta.url)

    // ✅ Resolve from module directory
    const templatePath = resolver.resolve('./templates/config.ts')

    // ✅ Check if exists (optional)
    const fs = await import('fs')
    if (!fs.existsSync(templatePath)) {
      console.warn('Template not found:', templatePath)
      return
    }

    addTemplate({
      filename: 'config.ts',
      src: templatePath
    })
  }
})

Common Path Mistakes

// ❌ Wrong - relative path without resolver
addTemplate({
  src: './templates/config.ts'
})

// ❌ Wrong - missing file extension sometimes
addTemplate({
  src: resolver.resolve('./templates/config')  // Might need .ts
})

// ✅ Correct
addTemplate({
  src: resolver.resolve('./templates/config.ts')
})

Debugging Templates

export default defineNuxtModule({
  setup() {
    const resolver = createResolver(import.meta.url)
    const templatePath = resolver.resolve('./templates/my-template.ts')

    console.log('Template path:', templatePath)
    console.log('Module dir:', resolver.resolve('.'))

    // List available files
    const fs = await import('fs')
    const templatesDir = resolver.resolve('./templates')
    if (fs.existsSync(templatesDir)) {
      console.log('Available templates:', fs.readdirSync(templatesDir))
    }
  }
})

Generated Template Location

Templates are generated in .nuxt/:

.nuxt/
├── my-template.ts
├── types/
│   └── my-module.d.ts
└── ...

Access in code:

// #build is alias for .nuxt
import config from '#build/my-template'

Quick Checklist

• Template file exists at specified path
• Using createResolver for path resolution
• File extension is included in path
• Template syntax (EJS) is valid if used
• Check .nuxt/ for generated output
• Use getContents for inline templates