English | ็ฎไฝไธญๆ
Laravel is now supported! 🎉
Mirgrate from Vue i18n Ally
🧱 Supported Frameworks
Frameworks will be auto-detected when one of the dependencies can be found in the project.
If you would like to make it work for frameworks not listed above, you can:
โก Features
Inline annotation
Hover & Direct actions
Manage all translations in one place
Translations missing report
Multiple formats supported
Refactors & Auto translate
Extract translations from code
Annonation for JSON and YAML
General
| Format |
Read |
Write |
Annonations |
Note |
| JSON |
โ
|
โ
|
โ
|
|
| YAML |
โ
|
โ
|
โ
|
Comments will NOT preserved* |
| JSON5 |
โ
|
โ
|
โ |
Comments will NOT preserved* |
| INI |
โ
|
โ
|
โ |
Comments will NOT preserved* |
| JavaScript |
โ
|
โ |
โ |
Forced in readonly mode |
| TypeScript |
โ
|
โ |
โ |
Forced in readonly mode |
| PHP |
โ
|
โ |
โ |
Forced in readonly mode |
* Due to the limitation of yaml.dumps(#196) and JSON5.stringify(#177), comments in YAML and JSON5 will be OMITTED on any modification by this extension (editing, translating, etc). If you are using comments in your locale files, you can turn on readonly mode by i18n-ally.readonly to prevent losing comments.
📂 Directory structure
You can have locales directory structured like this with zero-configuration
locales # i18n, langs, locale are also acceptable
โโโ en.json
โโโ de-DE.json
โโโ zh-CN.yml # YAML
โโโ zh-TW.ts # You can mix different formats
โโโ ...
โโโ <contry-code>.json
or
locales
โโโ en
| โโโ common.json
| โโโ buttons.json
| โโโ ...
| โโโ <filenames>.json
โโโ de-DE
| โโโ common.json
| โโโ buttons.json
| โโโ ...
โโโ <contry-code>
โโโ common.json
โโโ buttons.json
โโโ ...
โ Common Configurations
All fields should add prefix "i18n-ally." in the setting.
| Field |
Default |
Description |
sourceLanguage |
en |
The primary locale for the project. It will also be the source language on translating |
displayLanguage |
en |
Displaying language in annotations and tree views |
localesPaths |
auto |
Locales directory path, relative to the root of your project. It can also be an array of paths. Glob patterns are acceptable |
sortKeys |
false |
Sorting keys alphabetically on saving |
keystyle |
auto |
Key style in your locale files, can be flat({"a.b.c": "..."}) or nested({"a": {"b": {"c": "..."}}}) |
annotations |
true |
Enabling inline annotations |
keepFulfilled |
false |
Always keep all keys fulfilled with empty string |
enabledFrameworks |
auto |
Specify the frameworks support to enable. If no value is set, the extension will detect frameworks automatically |
enabledParsers |
auto |
Specify the parsers of local file formats. It will enable all the possible parsers by default |
indent |
2 |
Indentation size for your locale files |
tabStyle |
space |
Tab style for your locale files |
disablePathParsing |
false |
Enable this if you use natural languages as the key of your locale messages |
🔩 Advanced Configurations
| Field |
Default |
Description |
filenameMatchRegex |
null |
Accept a regex allows you to map the filenames. The first group in regex should be the locale code |
keyMatchRegex |
[\w\d\. \-\[\]]*? |
Regex for keypath matching. You can set it to .*? to allowing Unicode |
promptTranslatingSource |
false |
Prompt to select source locale on translating every time. If set false, the source language in the config will be used |
fileNamespace |
auto |
Use filename as the root of locale messages |
encoding |
auto |
The locale file encoding. Auto-detect by default |
readonly |
false |
Work on readonly mode. Translating and editing will be disabled |
โ Recommend Setup
To get the best experience of this extension (and other translation services as well). We recommend you to use the following setup:
- Use
JSON or YAML as your locale files. (Although other formats are supported as well, JSON and YAML works best for statical analysis)
- With following configurations allows you to keep synced through all the locales.
{
"i18n-ally.sortKeys": true,
"i18n-ally.keepFulfilled": true,
}
🌍 Help translate this extension
This extension itself supports i18n as well, it will be auto-matched to the display language you used in your VSCode editor. We have supported the following languages.
If you would like to help translate this extension, you can do it by following steps.
- Fork this repo and clone it to you local machine
- Copy
package.nls.json to package.nls.<locale-code>.json in the root of the repo
- Translate every single message in the new JSON file you created.
- You may also update the table above in README.md
- Commit changes and make a PR to this repo
We recommend you to use VSCode with i18n-ally. It supports i18n for VSCode extension development which can help you translate itself 😁.
🎯 Troubleshooting
Extension doesn't work/show up (There is no icon in Activity bar)
This extension support numerous frameworks, be sure the framework you are using is in the list.
Besides, package.json is relied on detecting which framework you are using. It should be at the root of your project as well.
I can see the icon in Activity bar, but nothing shows up
- Locales path config missing.
locales path will be detected automatically on the first time you open a project. If nothing shows up, you may need to configure it manually. There are two ways to do that:
- Open Command Palette (
Ctrl-Shift-P or โโงP), type i18n Ally: Manual configure locales path then press enter and follow the guide.
- Goto to the settings of VSCode and set
i18n-ally.localesPaths manually.
- The source / displaying locale. The default locale is set to English(
en). If you don't have English in your supporting locales, you may need to config it through command i18n Ally: Change source language
- Check your Directory structure
I am working on a monorepo and the extension can not detect my project
Usually, i18n ally looks for your package.json file at the root of your project. If you don't have it at the root, you can always specify the framework(s) you are using by i18n-ally.enabledFrameworks config.
Advanced folder directory configurations
In some cases, you may use modules, monorepo or other philosophies to organize your locale files.
For example, you have the following directory structure need to be config.
packages
โโโ pkgA
| โโโ i18n
| โโโ en.messages.json
| โโโ zh-CN.messages.json
| โโโ ...
โโโ pkgB
| โโโ i18n
| โโโ en.messages.json
| โโโ zh-CN.messages.json
| โโโ ...
โโโ ...
You could change your config like this:
{
"i18n-ally.localesPaths": [
"packages/**/**/i18n"
],
"i18n-ally.filenameMatchRegex": "^([\\w-]*)\\.messages\\.json",
}
👨โ💻 Thanks
This extension was inspired by think2011/vscode-vue-i18n, it can't be existed without @think2011's great work.
Support for Vue Single File Component (SFC) is powered by kazupon/vue-i18n-locale-message, which is created by the author of vue-i18n. Thanks for making this!
Also my great thanks to all the awesome contributors and YOU for reading this!
Lastly, I want to have a special thanks to my partner @iiiiiiines who have encouraged and supported me working on this project.
โ Buy Me a Coffee
I made this project with heart โค
If you found it useful, you may consider buy me a coffee!
Open Collective
Donate via PayPal
📄 License
MIT License ยฉ 2019-2020 Anthony Fu
Angular(
Flutter(
