nuxt-i18n — Claude Code skill for Nuxt localization
A skill that walks your coding agent through @nuxtjs/i18n setup: locales, translated routes, language detection and locale SEO.
npx skills add onmax/nuxt-skills --skill nuxt-i18n -a claude-codeWhat nuxt-i18n does
The skill covers locale messages, localized routes, language detection and locale metadata in Nuxt. Before touching anything, the agent inspects the installed @nuxtjs/i18n version, nuxt.config.*, i18n/i18n.config.*, locale files and the pages involved, then opens the matching reference.
Three references ship with it: configuration (locale objects, file layout, browser detection, Vue I18n options), messages (translation keys, interpolation, plurals, dates, numbers, runtime loading) and routing plus SEO (route strategies, localized links, switchers, custom paths, dynamic slugs). Module options stay in nuxt.config, Vue I18n options in i18n.config, translations in locale files. Locale files resolve from i18n/locales/ by default.
After the change the agent runs nuxi prepare and the project typecheck, then opens the affected route in the default locale and one secondary locale. Scope is i18n only — pages, middleware, data fetching and server routes belong to the separate nuxt skill, so a project with custom SSR state means hopping between the two.
What it helps with
- add a second locale to a Nuxt app
- set up browser language detection
- translate routes and internal links
- build a language switcher for the header
- configure fallback to the default locale
Example prompts for the agent
- set up @nuxtjs/i18n with en and fr locales, files under i18n/locales
- add a language switcher to the header and localize the links
- add per-locale SEO metadata to the pages
How to install nuxt-i18n
1Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-i18n -a claude-code2Manually: put the files in place
~/.claude/skills/nuxt-i18n/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/nuxt-i18n/
1Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-i18n -a codex2Manually: put the files in place
.agents/skills/nuxt-i18n/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-i18n -a cursor2Manually: put the files in place
.cursor/skills/nuxt-i18n/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install onmax/nuxt-skills nuxt-i18n2Manually: put the files in place
.github/skills/nuxt-i18n/SKILL.md1Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-i18n -a gemini-cli2Platform CLI
gemini skills install https://github.com/onmax/nuxt-skills --path skills/nuxt-i18nManually: put the files in place
.devin/skills/nuxt-i18n/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add onmax/nuxt-skills --skill nuxt-i18n -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about nuxt-i18n
How do I install nuxt-i18n in Claude?
Run npx skills add onmax/nuxt-skills --skill nuxt-i18n -a claude-code. The skill lands in ~/.claude/skills/nuxt-i18n/SKILL.md.
What does nuxt-i18n do?
It guides the agent through locale setup, message and route translation, browser detection and locale SEO for Nuxt apps using @nuxtjs/i18n.
Which other platforms are supported?
Codex, Cursor, GitHub Copilot, Gemini CLI and OpenCode, each with its own install command.
Source text
SKILL.md · MIT
---
name: nuxt-i18n
description: Internationalize Nuxt applications with @nuxtjs/i18n. Use when configuring locales or browser detection, translating messages or routes, building locale switchers, handling fallbacks, lazy-loading messages, or adding locale SEO.
license: MIT
---
# Nuxt I18n
Nuxt I18n owns locale messages, localized routes, language detection, and locale metadata. Nuxt owns the surrounding page, rendering, and server lifecycle.
## Workflow
1. Inspect the installed `@nuxtjs/i18n` version, `nuxt.config.*`, `i18n/i18n.config.*`, locale files, and affected pages. The setup is understood when locale codes, files, `defaultLocale`, and the routing strategy agree.
2. Open the smallest matching guide below. Keep module options in `nuxt.config`, Vue I18n options in `i18n.config`, and translated messages in locale files.
3. Implement with localized links and module composables so routing, message loading, and SEO share one locale state.
4. Run `nuxi prepare` and the project's typecheck, then visit the affected route in the default and one secondary locale. The change is complete when both locales render the expected message, URL, language metadata, and fallback behavior.
## Routing
| Task | Open |
| ------------------------------------------------------------------------------------ | -------------------------------------------- |
| Installation, locale objects, file layout, browser detection, or Vue I18n config | [Configuration](references/configuration.md) |
| Translation keys, interpolation, plurals, dates, numbers, or runtime message loading | [Messages](references/messages.md) |
| Route strategies, localized links, switchers, custom paths, dynamic slugs, or SEO | [Routing and SEO](references/routing.md) |
| Nuxt pages, middleware, data fetching, SSR state, or server routes | `nuxt` skill |
## Baseline
```bash
npx nuxi@latest module add @nuxtjs/i18n
```
```ts
export default defineNuxtConfig({
modules: ['@nuxtjs/i18n'],
i18n: {
defaultLocale: 'en',
locales: [
{ code: 'en', language: 'en-US', name: 'English', file: 'en.json' },
{ code: 'fr', language: 'fr-FR', name: 'Français', file: 'fr.json' },
],
},
})
```
```json
{
"welcome": "Welcome"
}
```
Locale files resolve from `i18n/locales/` by default. Use the same locale code in configuration, route helpers, locale files, and fallback rules.
© onmax · MIT · onmax/nuxt-skills