Giter VIP home page Giter VIP logo

i18n-ally's Introduction

logo

English | 简体中文

Visual Studio Marketplace Version Visual Studio Marketplace Downloads Visual Studio Marketplace Installs
Wiki GitHub last commit GitHub issues GitHub stars

v2.0 is released with new Editor UI and Review System 🎉

Migrate from v1.x


Supported Frameworks

Maintained by

Lokalise logo
Lokalise is the fastest growing language cloud technology made by developers, for developers.
As a collaborative productivity platform, it helps structure and automate the translation and localization process for any company in the world.
Learn more





Demo

i18n-ally on VS code demo



Inline Annotations

Hover and Direct Actions

Manage All Translations in One Place

Extract Translations from Code

Report Missing Translations

Machine Translation

Annotations for JSON and YAML

General Features

  • Supports multi-root workspaces
  • Supports remote development
  • Supports numerous popular frameworks
  • Supports linked locale messages
  • Uses i18n for the extension itself, of course. Translation List

🌍 Multilingual Support

This extension itself supports i18n as well. It will be auto-matched to the display language you use in your VS Code editor. We currently support the following languages.

Language Maintainer Contributors
English @antfu @rubjo, @EdRands
Simplified Chinese (简体中文) @antfu
Traditional Chinese (繁體中文) @antfu
Norwegian (Norsk) @rubjo
Spanish (Español) @Baltimer
Japanese (日本語) @isdh
Dutch (Nederlands) @Niekvdm, @Excalibaard
Portuguese (Brazilian) @Ibcs16
French (Français) @Nicoxx45, @eri, @Frank
Swedish (Svenska) @vladdeSV
Ukrainian (Українська) @uhodav
Russian (Русский) @uhodav
German (Deutsch) @alexanderniebuhr
Thai (ภาษาไทย) @watchakorn-18k
Turkish (Türkçe) @eri, @dilekerkut
Korean (한국어) @moka-ayumu
Hungarian (Magyar) @Cs4K1Sr4C @Cs4K1Sr4C

Help Translate

👨‍💻 If you would like to help a language's translation up to date, feel free to put your name in the Maintainers field. I will @mention you when needed. Much appreciated.

❤️ Thanks

This extension was inspired by think2011/vscode-vue-i18n, it wouldn't exist 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!

Code Contributors

My great thanks to all the awesome contributors:

📄 License

MIT License © 2021-PRESENT Lokalise

MIT License © 2019-2020 Anthony Fu

MIT License © 2018-2019 think2011

i18n-ally's People

Contributors

alexanderniebuhr avatar amannn avatar angeart avatar anilkk avatar antfu avatar beinarovic avatar bratzie avatar cs4k1sr4c avatar demivan avatar dependabot[bot] avatar edrands avatar excalibaard avatar farfromrefug avatar jduchateau avatar k-yle avatar kibertoad avatar kurtgokhan avatar mahesh0431 avatar mattkanwisher avatar movermeyer avatar renovate-bot avatar renovate[bot] avatar simeonc avatar terales avatar theletslook avatar think2011 avatar vladdesv avatar ypresto avatar yubaoquan avatar zerdox-x avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

i18n-ally's Issues

Allow configuring indentation size

In our project, we use 4 spaces as indentation size for pretty much all json and ts files. The auto formatter automatically formats these files with 4 spaces. And so does another tool that some people in our project are currently still using. i18n Ally saves the translation json files with 2 spaces of indentation. While this might not always be a problem, merge conflicts seem to occur more often and indicate the entire files as conflicting.
I would love a setting to configure the space indentation size.

Add json5 support

Hi,

We use .json5 in our project to enable the use of comments in locales files.

Is it possible to add the support of this extension please?

Thanks in advance.

unexpected supported locales

Always in dir-locales mode. Not sure happened in other mode.

My excepted result:
image
And the reality is:
image

I use the test file in the test/fixture/dir-locales.

I will add info later and pull a request. Please see pull #31

not working with Code Insiders

It does not seem to work for me. I am using the latest Code Insiders.
Screen Shot 2019-05-21 at 10 24 29
For some reason the extension wont activate?
Though it is enabled.
Any idea?
Thanks

Support for Namespaces

Does it support colon notation?

How can I get things working when namespace is selected with :

Снимок экрана 2019-11-27 в 21 51 01

[BUG] GlyphChars.ArrowUpRight can not be shown correctly on macOS 10.15.1

Describe the bug
Not sure if macOS is missing the font, the ArrowUpRight icon is shown as a missing character (a blank square)

Screenshot 2019-11-27 at 00 39 14

image

Is it just me or is it a macOS thing?
Maybe we can use another character on macOS?

To Reproduce
Steps to reproduce the behavior:

  1. Go to any file with i18n keys
  2. Hover on the key
  3. Wait until the tooltip is shown
  4. See error

can't load other lang key

Describe the bug
A clear and concise description of what the bug is.

Extension Version
1.4.6

Framework/i18n package you are using
react-i18next

To Reproduce
Steps to reproduce the behavior:

  1. ko.json add key , value
    "반려" : '반려"
  2. not work i18n-ally support

Extension Log
Go to View -> Output -> i18n Ally, and paste the content below. You should mask any sensitive information


Screenshots
If applicable, add screenshots to help explain your problem.
image

Desktop (please complete the following information):

  • OS: windows 10
  • Version :17763

动态拼接bug /Dynamic stitching bug

Describe the bug
A clear and concise description of what the bug is.

Extension Version
i18n Ally

Framework/i18n package you are using
vue-i18n

To Reproduce
Steps to reproduce the behavior:
ex:
vue page
{{ $t('common.'+type)}}
Can't be detected, the whole page will have problems, not displayed, and the layout is disordered

Desktop (please complete the following information):
版本: 1.41.0 (user setup)
提交: 9579eda04fdb3a9bba2750f15193e5fafe16b959
日期: 2019-12-11T17:59:52.065Z
Electron: 6.1.5
Chrome: 76.0.3809.146
Node.js: 12.4.0
V8: 7.6.303.31-electron.0
OS: Windows_NT ia32 10.0.17763

Missing keys auto-translate got slow

Describe the bug
Missing keys auto-translate got slow. I guess the translate API got throttled. What can I do about that?

Extension Version
1.1.1

Framework/i18n package you are using
React

To Reproduce
Steps to reproduce the behavior:

  1. Right click 'Missing translations' on a language ( 900 missing translations)
  2. Select Translate

Screenshots
Screenshot from 2019-11-28 16-49-45

Desktop (please complete the following information):

  • Ubuntu 18.04.3 LTS

Single File Components i18n Support

Edit: 2019-07-29

Experimental support for SFC is landed in v0.29.0, please check out the release note for more details.

https://github.com/antfu/vue-i18n-ally/releases/tag/0.29.0


vue-i18n has a feature allow user to define their locale messages in the i18n section of Single File Components(SFC)

Something like this:

<i18n>
{
  "en": {
    "hello": "helloworld!"
  },
  "ja": {
    "hello": "こんにちは、世界"
  }
}
</i18n>

<template>
  <div class="parent">
    <p>message: {{ $t('hello') }}</p>
  </div>
</template>

Supporting SFC locales need a lot of work to the current code base. And I am not sure if it's a good practice at all. So I opened this issue for make a survey about this feature usages.

If you are using SFC locales and would like to see it supported by this extension. Please upvote this comment 👍

Also, feel free to leave comments to discuss about this topic. Thanks. 😄

Inline annotation doesn't work if backticks are used

If you use single or double quotes to define the key to translate like $t('FOO') or $t("FOO") it will show the inline translation correctly
imagen

but if backticks are used $t(`FOO`) then it doesn't work

imagen

Normally this wouldn't be a issue because everyone use the quotes, but in my case I forgot about them after placing a variable inside the string and then removing that variable, leaving the string with backticks.

Allow adding new keys from tree view

From the tree view, it is possible to edit translations, rename keys and delete keys. But it isn't possible to add new keys from there. It would be great if it was possible to add new keys from the tree view.

Duplicating existing keys here would also be a great feature. As i often see myself duplicating existing keys, like error messages, and slightly changing them.

Custom package.json path support

I'm running a project where the Vue setup is inside a PHP project and therefore - the package.json file is not in the root of the workspace. VS Code works fine, since it supports scanning recursively for package.json, but this extension says it cannot detect it. So, I'd like to request either a setting, so I can set a custom path for package.json (or let's say a relative custom root would be maybe even better) or make the extension scan for package.json recursively, like VS Code does itself.

nuxt-i18n

Hi, package looks very usefull but when i try with nuxt nothing shows up

Angular native i18n

What framework do you want to have? Please provide links of its i18n solution/package.
Angular

https://angular.io/guide/i18n

Please provide some overall screenshots about how the i18n usage would be like

<h1 i18n="site header|An introduction header for this sample@@introductionHeader">Hello i18n!</h1>

Please provide a minimal starter project
Already included in the examples
https://github.com/antfu/i18n-ally/tree/i18n-ally/examples/angular

Additional context
Things to be done to support angular

Vote

This extension is supporting ngx-translate now. I am not an Angular user and I am not sure what's the community favor.

If you would like to see this get supported, please hit 👍 to vote on this. When it's hit 15 👍 I would start to consider implementing this. Thanks!

Trouble with nested properties

In my en.json I have :

"Page":{
    "Dealers": {
      "CleanAccount": "Account",
      "StatusCode": "Status",
      "StoreName": "Store Name",
      "BuyingGroupDescription": "Buying Group",
      "Address": "Address",
      "AddressAdditional": "Address Additional",
      "City": "City",
      "StateDescription": "State/Province",
      "CountryDescription": "Country",
      "ZipCode": "Zip/Postal code",
      "Representative": "Representative"
    }
}

image

but in my component when I click the edit the translation it creates a new property at the end of my en.json file:

"Page.Dealers.Address":"Address"

Instead of modifying the existing nested one.

Is there something I am missing? Do I have to turn on an option to support the nested properties ?

Other than that, great work on this extension, it makes dealing with translations so much easier :)

Ember Intl

What framework do you want to have? Please provide links of its i18n solution/package.

ember-intl, https://www.npmjs.com/package/ember-intl

Please provide some overall screenshots about how the i18n usage would be like

{{t 'photos.banner' numPhotos=model.photos.length}}

this.intl.t('photos.banner')

Problem in detect locale files

Hi,
I used your lovely extension on my mac but when i want to configure locale files on other pcs extension doesn't detect locale files
I tried manual locale file configuration

[Feature Request] Set other root path.

The 'package.json' is not in the root path of my project.

Additional context
Error msg:

Error on parsing package.json
⚠ Current workspace is not a valid project, extension disabled

Solution:
Let me set the root path to the angular project.
like:

"i18n-ally.projectRootPath": "folder/folder/folder",

[BUG] [Vue] Translations nesting outside language file are not detected

When the nesting is done outside the language file it is not detected and the translation is reported as missing.

Steps to reproduce the behavior:

  1. Create several language files, like "a.json", "b.json" etc. with a translation entry "test" in "a.json"
  2. Configure Vue i18n in the following :
const i18n = new VueI18n({
	locale: 'nl',
	fallbackLocale: 'en',
	messages: {
		'en': {
			'A': require('Vue/locale/en/a.json'),
			'B': require('Vue/locale/en/b.json')
		},
		'nl': {
			'A': require('Vue/locale/nl/a.json'),
			'B': require('Vue/locale/nl/b.json')
		}
	}
});
  1. Try using the translation in a Vue single file component like this ({{ $t("A.test") }})
  2. The above is valid structure and works properly, but i18n Ally says the string translation is missing.

I understand, that parsing such a complex case might be heavy and next to impossible, so maybe a a solution where the user can tell i18n Ally that if (and how) a given lang file is nested in the code would be acceptable.

Better progress bar

Currently the progress bar looks weird on Windows

image

I am not sure if this problem also exists on macOS and Linux. Screenshots are welcome

It should be a better workaround.

Locale with key with hyphen doesn't show preview in SFC

Hi,

We have keys with hyphen, like : message.the-title.
But the preview doesn't show in the single file component.
It display well in the tree view of the plugin.
No problem with the others keys.

FYI : Our locals files are in json5 and the plugin is in readonly.

JSON with comments (JSONC) support

In some use case, we may need to keep comments inside locale files. Although YAML and JSON5 supports comments, but due to the parser limitation, it's not possible to keep comments on dumping. The current workaround is to make this extension in readonly mode when we need to use comments.

This issue is to support JSONC(microsoft/node-jsonc-parser) from vscode to make comments work well.

Relative to #59
Refer to https://github.com/antfu/vue-i18n-ally#comments-in-yamljson5

Wrong missing report

Using the latest version i see something wrong
The screenshot should be enough. It tells me that a translation is missing. However it does not appear in missing (should for both languages as the key does not exist in JSON).
Screen Shot 2019-12-05 at 15 55 50

Inline annotation doesn't work if the JSON is flat

If you use a plain tree to organize the translations in the JSON, the extension won't work correctly.

It will detect the translation on it's own menu but won't detect it on inline annotations like this example:
imagen

But if I use the classic tree in JSON it will work correctly:
imagen

Tree view for flat data structure is not nested

Describe the bug
In the project i'm working on, we are using a flat data structure for the translation files. The tree view shows this as one long list of keys, with only the translations nested under them. It would be great if it could show the dot separated words as nodes in the tree.

Extension Version
i18n Ally v1.3.3

Framework/i18n package you are using
ngx-translate

To Reproduce
I'm assuming you can just open a project with translation files that have a flat data structure.

Screenshots
This is how it looks now:
image

I would like something more similar to this:
image

Desktop (please complete the following information):
Windows 10

How 'translate' works ?

I have settled the en locale as display and source, but when I tried to use the automatic translate button, all value returns like ????, so how does this translate button works ? Am I using the wrong way ?

Screenshot 2019-11-13 17 54 46

Discover which translations are missing

image

In the panel above I can see, for instance, that 4 French translations are missing. However I can't know which ones they are and if you consider translation files of some hundreds of lines, it can be hard to find them.

Can we make each of the languages expandable to see the specific missing translations in detail?

It stopped working for every version after 0.23.0

Every version after that is not working anymore, some don't even display the icon in the toolbar, and the last one that does show it it's all empty, it seems that it doesn't get any locale file.

Support passing folder structure map as a config to the plugin

In our case of a sizeable vue app, we have solved the problem of locale messages needed in both the FE and the BE with the use of an npm package (which will also change soon as we bring together the FE, BE and shared libs in a monorepo).

By that definition, our folder/file structure does fail to map with the expected structure of this vscode plugin as our messages are not even in the src folder.

In fact our structure currently looks like this:

shared-libs (could be out of `src` or even inside `node_modules`)
  ├── i18n
  |   ├── messages
  |   |   ├── en.messages.ts
  |   |   ├── de.messages.ts
  |   |   └── ...
  |   └── ...
  └── ...

Acceptance criteria:

  1. abstract the expected structure enough to be configurable
  2. user can pass a regex that matches the path of each translated locales/messages file

Notes:

  • feel free to edit the acceptance criteria as you see fit to best solve the described problem
  • this is a really cool plugin, we'd love to be able to use it! :)

Inline annotation does not work if t function contains a newline

Describe the bug
Inline annotation does not work if the t function contains a newline as such:

t(
    "calendars.gregorian..."
);

This is an issue as Prettier formats long keys on new lines.

Extension Version
i18n Ally (v 1.3.3)

Framework/i18n package you are using
react-i18next

To Reproduce
Assuming existing framework, create a looong key, and type the t function as above

Desktop (please complete the following information):

  • OS: Win10
  • Version 1803

Create key if it doesn't exist

I don't know if this is already in there, if so, I can't get it to work.

Given
en.yaml

label:
  a: "this is translated"

And say I use

<p>{{$t('label.b')}}</p>

Now this does obliviously not work.
I would like to click the "pencil" icon and just translate it from the UI and the plugin should create the key if it does not exist, instead of having to create the label.b key first.

In this UI
image

IF this exist, I can't get it to work

I don't see any errors in the output

And while we are at the feature requests, could you add the Danish flag ? 😆

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.