Index of every page on this site: llms.txt
All skills
onmax avatar

/nuxt-modules

@2e74504 official
by Maxonmax/nuxt-skills722 stars
38
Run it yourself

Use when creating Nuxt modules: (1) Published npm modules (@nuxtjs/, nuxt-), (2) Local project modules (modules/ directory), (3) Runtime extensions (components, composables, plugins), (4) Server extensions (API routes, middleware), (5) Releasing/publishing modules to npm, (6) Setting up CI/CD workflows for modules. Provides defineNuxtModule patterns, Kit utilities, hooks, E2E testing, and release automation.

Use this Skill: https://skilld.dev/gh/onmax/nuxt-skills/nuxt-modules

Nothing lands on disk. Nothing to clean up.

Fork this Skill

Edit a local copy. It keeps the author and licence.

referencestemplate-dependencies.md

≈755 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Template regeneration in development

addTemplate and addTypeTemplate accept dependsOn in Nuxt versions that support template dependency tracking. Check the Nuxt and @nuxt/kit versions in your module's compatibility range before using it.

Dependency declarations are opt-in because Nuxt cannot infer what a module's template reads. With no declaration, getContents templates regenerate on watched file changes; src templates default to regenerating only when their source changes.

Choose a declaration that matches the generated output's inputs:

Inputs Declaration
Configuration or which files exist, without reading file contents dependsOn: []
Nuxt pages or plugins dependsOn: ['pages'] or dependsOn: ['plugins']
Custom file contents A predicate such as dependsOn: ({ path }) => path.endsWith('.yaml')

For a template whose output depends only on module options:

addTemplate({
  filename: 'my-module/config.mjs',
  dependsOn: [],
  getContents: () => `export default ${JSON.stringify(options)}`,
})

The same declaration works on addTypeTemplate. dependsOn: [] skips regeneration on edits to existing watched files. It does not make a template run only once: adding or removing files and explicit regeneration through updateTemplates can still regenerate it.

Predicates filter file events; they do not establish filesystem watchers. Ensure custom inputs are watched. Matching entries in nuxt.options.watch request a Nuxt restart, so use that option when rerunning setup is intended. For inputs already covered by Nuxt's watcher, the dependency predicate can handle template invalidation without an additional restart entry or regeneration hook. An incomplete dependency declaration can leave generated output stale. Keep the default when the inputs are uncertain.

When module-owned state requires explicit regeneration, select the affected template:

import { updateTemplates } from '@nuxt/kit'

await updateTemplates({
  filter: template => template.filename === 'my-module/config.mjs',
})

Calling updateTemplates() without a filter requests regeneration of every template. A filter limits template compilation; app resolution and template hooks can still run. Avoid adding a manual refresh for an input that automatic dependency tracking already handles. A module-owned watcher for external inputs also needs cleanup on Nuxt's close hook.

Verify in development by editing a relevant input and an unrelated watched file, then adding/removing an input and explicitly regenerating the template. Check both the generated contents and whether getContents ran.

Count executions and compare generated output before interpreting performance results. Reduced template work or dev-server CPU does not establish faster browser-visible HMR; measure that separately when making that claim.

See Nuxt Kit: skipping regeneration in development.

Source: SKILL.md on GitHub

skilld matched fixed text patterns in SKILL.md and file names. Patterns miss obfuscated code.

skilld run checks every file with the same patterns. It asks for approval before it loads a Skill with a behavior marked Needs approval.

No alerts10d5 checks · Risk SAFE
  • Gen Agent Trust Hub10d

    This skill is a safe and high-quality guide for Nuxt module development. It correctly implements security best practices, such as recommending OIDC for CI/CD workflows and providing safe patterns for template generation.

  • Socket10d

    No alerts

  • Snyk10d

    Risk: LOW · No issues

  • Runlayer8mo

    4 files scanned · No issues

  • ZeroLeaks6mo

    Score: 93/100 · 2 sections analyzed

Signed by skilld at 2e74504. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub last week.

Activeupdated 2 weeks ago

README badge

README badge for onmax/nuxt-skills/nuxt-modules

Instructs Claude on building Nuxt modules using defineNuxtModule, Kit utilities, and hooks to extend Nuxt with components, composables, plugins, server routes, and middleware. Covers published npm modules, local project modules, E2E testing patterns, and release automation workflows.

Generated from the current SKILL.md.

Does this skill cover local modules in the modules/ directory?
Yes. The skill covers published npm modules, local project modules in the modules/ directory, and inline modules defined in nuxt.config.ts.
What testing approach does this skill teach?
The skill provides E2E testing patterns and best practices via the testing-and-publishing reference, though you load it only when needed for your task.
Does this include CI/CD setup?
Yes. The skill includes copy-paste CI/CD workflow templates in the ci-workflows reference for automating module testing and release.
Can I use this skill to publish a module to npm?
Yes. The testing-and-publishing reference covers releasing and publishing modules to npm registries with @nuxtjs/ or nuxt- naming conventions.
Does this cover runtime extensions like components and composables?
Yes. The skill covers injecting components, composables, plugins, and server extensions (API routes, middleware) into user applications via the runtime/ directory.

Generated from the current SKILL.md. These answers refresh after source changes.