Creating a Linter for Multi-Language Support Files in Chrome Extension Development

Introduction

I recently added multi-language support to my personal Chrome extension called TabTabTab. In Chrome extensions, when adding multi-language support, you define the corresponding words for each language in the messages.json file. However, as the number of words grows, it becomes prone to mistakes such as missing translations for certain languages.

To alleviate these issues related to multi-language support in Chrome extensions, I created a linter called chromex-locale-lint.

Usage

First, install chromex-locale-lint via npm or yarn:

npm install --save-dev chromex-locale-lint

yarn add --dev chromex-locale-lint

To run the linter, execute the following command:

npx chromex-locale-lint --localesDir /path/to/locales --baseLang en

The available arguments are as follows (both are optional):

• --localesDir: Specify the directory where the _locales directory for multi-language support is located. The default is ./_locales.
• --baseLang: Specify the base language. The default is en.

Features

The main features of the current version (v0.0.2) are as follows:

• If a key exists in other language files but not in the base language file, it throws an error.
• If a key exists in the base language file but not in other language files, it emits a warning.
• If the directory name for the multi-language JSON files is not supported by Chrome extensions, it throws an error.

Conclusion

If you’re working on Chrome extension development and implementing multi-language support or planning to do so, consider using chromex-locale-lint. While the current version only implements the necessary features for my own use, I welcome feature requests and bug reports on GitHub.

Repository: https://github.com/okaryo/chromex-locale-lint