VSCode integration

To improve the workflow for managing messages right from your code editor, you can use an extension for VSCode that includes support for next-intl.

These extensions are known to support next-intl:

1. i18n Ally
2. inlang IDE extension

i18n Ally

Features:

• Message extraction
• Inline annotations
• Inline message editing
• Machine translations (opens in a new tab)
• An editor UI (opens in a new tab) that provides a file-based system for annotating messages & reviews

Setup:

1. Install i18n Ally (opens in a new tab)
2. Configure the extension in your project via workspace settings (opens in a new tab)

"i18n-ally.localesPaths": ["./path/to/your/messages"], // E.g. "./messages"
"i18n-ally.keystyle": "nested"

inlang IDE extension

Features:

• Message extraction
• Inline annotations
• Inline message editing
• Message linting (opens in a new tab)
• Integration with other parts of the inlang ecosystem like the Fink editor (opens in a new tab) or the inlang CLI (opens in a new tab)

Setup:

1. Install the inlang IDE extension (opens in a new tab)
2. Configure the extension in your project via project.inlang/settings.json:

{
  "$schema": "https://inlang.com/schema/project-settings",
  "sourceLanguageTag": "en",
  "languageTags": ["en", "de"],
  "modules": [
    "https://cdn.jsdelivr.net/npm/@inlang/plugin-next-intl@latest/dist/index.js"
  ],
  "plugin.inlang.nextIntl": {
    "pathPattern": "./messages/{languageTag}.json"
  }
}

Learn more in the inlang docs: Setting up next-intl with the IDE extension (opens in a new tab)