eslint-plugin-react-i18n-extractor

Helper for react-intl i18n to extract string literals and attributes in a format that is suitable for formatJS, react-intl, etc.

This rule is inspired by jsx-no-literals and it expand his capabilities, impementing a --fix.

The rule is customizable, and enhance the development experience, especially if a linter is part of the developer lifecyle and/or there's the need to internazionalize a legacy application from scratch.

For example the rule can be integrated with an IDE (like IntelliJ, VSCode, emacs, VIM,...) and automatically transform the literal strings into a standard format.

As an example, by default this code
``



`
gets transformed into
`

`

and if you enable the options noAttributeStrings and noAttributeStringsList=["title"]
`



`
gets transformed into
`

`

Installation

You'll first need to install ESLint:

`sh
npm i eslint --save-dev
`
or
`sh
yarn add -D eslint
`


Next, install eslint-plugin-react-i18n-extractor:

`sh
npm install eslint-plugin-react-i18n-extractor --save-dev
`
or
`sh
yarn add -D eslint-plugin-react-i18n-extractor
`

or add it locally on a subdirectory after the checkout:
`
"devDependencies": {
"@babel/eslint-parser": "^7.21.3",
"@typescript-eslint/eslint-plugin": "^5.43.0",
...
"eslint-plugin-react-i18n-extractor": "^0.0.2",
...
}
`

Usage

Add react-i18n-extractor to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:

`json
{
"plugins": [
"react-i18n-extractor"
]
}
`


Then configure the rules you want to use under the rules section.

`json
{
"rules": {
"react-i18n-extractor/no-static-text": [
"warn" : {
"noAttributeStrings": true,
"idPrefix": "app.",
"noAttributeStringsInclude": [
"title",
"pretitle",
"placeholder",
"label",
"aria-label",
"suffix",
"message"
]}
]
}
}
`

Rules

🔧 Automatically fixable by the --fix` CLI option.

| Name | Description | 🔧 |
| :--------------------------------------------- | :------------------- | :- |
| no-static-text | extract static text | 🔧 |