@elastic/eslint-plugin-react-intl

react-intl specific linting rules for ESLint

Usage no npm install needed!

<script type="module">
  import elasticEslintPluginReactIntl from 'https://cdn.skypack.dev/@elastic/eslint-plugin-react-intl';
</script>

README

eslint-plugin-react-intl

Note: This is a fork from http://npmjs.org/package/eslint-plugin-react-intl.

react-intl (2.0) specific linting rules for ESLint

Installation

Install ESLint either locally or globally.

$ npm install eslint

If you installed ESLint globally, you have to install React-intl plugin globally too. Otherwise, install it locally.

$ npm install eslint-plugin-react-intl

Configuration

Add plugins section and specify ESLint-plugin-React as a plugin.

{
  "plugins": [
    "@elastic/eslint-plugin-react-intl"
  ]
}

If it is not already the case you must also configure ESLint to support JSX.

With ESLint 1.x.x:

{
  "ecmaFeatures": {
    "jsx": true
  }
}

With ESLint 2.x.x:

{
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    }
  }
}

List of supported rules

  • string-is-marked-for-translation: Catch strings that aren't marked for translation, e.g. contained in a component from react-intl 2.0.
  • is-valid-icu-message-syntax: Catch defaultMessage attributes that aren't valid ICU message syntax
  • no-inline-translations-with-formatmessage: Forbid calls to formatMessage() from using literal translations, because there are not picked up by babel-plugin-react-intl.

Thanks

License

ESLint-plugin-React-intl is licensed under the MIT License.