#🕵️♂️ i18n inspector for VS Code
#Used by developers from:
Inspect i18n within VS Code with powerful tools designed to streamline the translation process. Visualize, edit, and lint translated strings effortlessly using Inline Decorations & Hover Support. Extract new strings with a simple click, making localization tasks more intuitive and efficient.
Inlang is a powerful open-source
#Manage Translations directly from your Code
View translations within your code, extract new strings with a simple click, and effortlessly edit translated strings using Inline Decorations & Hover Support. Get notified of missing translations and other issues in real-time directly in your IDE.
#Inlang Tab - Transparent & Fast
You can have multiple projects in your repository. By using the inlang tab, it's easy to switch between projects. Whenever you change the source text, translations from the resource files will be automatically updated. Additionally, the tab menu provides a quick overview of any project errors in the setup.
#Usage
Just highlight/select the text you want and hit cmd .
or ctrl +
(Quick Fix / Yellow Bulb) to open the translate dialog to provide an id for it.
Hover over the message to see the tooltip with the translation.
If something isn't working as expected, please join our Discord
#Let's get started
- Add a
project.inlang
folder to your repository - Create a
settings.json
file to that new dirproject.inlang/settings.json
- Install a plugin that reads and writes your messages from the inlang marketplace
- Install a syntax matcher/function matcher from the inlang marketplace
- Optional: Install lint rules to find errors in your translations from the inlang marketplace
Look at the example repository
#Requirements:
- VS Code version 1.84.0 or higher.
- Node.js version v18 or higher.
#Support: Join our Discord!
If something isn't working as expected or you have a feature suggestion, please join our Discord
#Plugin authors
You can configure the extension to your needs by defining the customApi
property in the Plugin
interface.
Property | Type | Description |
---|---|---|
messageReferenceMatchers | Array | An array of functions that define matcher's for message references inside the code. Each function takes an argument of type { documentText: string } and returns a promise that resolves to an array of message references (as defined by the messageReferenceSchema ). |
extractMessageOptions | Array | An array of objects that define options for extracting messages. Each object has a property callback which is a function that is called when the user finishes the message extraction command. The callback function takes two arguments of type string : messageId (the message identifier entered by the user) and selection (the text which was extracted), and returns a string that represents the code which should be inserted into the document. |
documentSelectors | Array | An array of VS Code DocumentSelectorslanguage , scheme , pattern , and notebookType . |
For this example, the extension parses strings with a t
translation function & gives the according extract options {t("messageID")}
& t("messageID")
.
You can fully customize this behavior.