oxlint-plugin-react-native

Lint rules for React Native projects, built for Oxlint.

Rules are based on eslint-plugin-react-native by Intellicode, ported to Oxlint. This plugin may evolve with new rules, improvements, or updates over time.

Installation

npm

npm install oxlint-plugin-react-native oxlint --save-dev

yarn

yarn add -D oxlint-plugin-react-native oxlint

Configuration

In your Oxlint config (e.g. .oxlintrc.json), register the plugin by name and enable the rules you want:

{
  "jsPlugins": [
    { "name": "react-native", "specifier": "oxlint-plugin-react-native" }
  ],
  "rules": {
    "react-native/no-color-literals": "error",
    "react-native/no-inline-styles": "warn",
    "react-native/no-raw-text": "error",
    "react-native/no-single-element-style-arrays": "error",
    "react-native/no-unused-styles": "warn",
    "react-native/sort-styles": "warn"
  }
}

Rules

| Rule | Description | Fix | | ------------------------------------------------------------------------ | --------------------------------------------------------- | :-: | | no-color-literals | Disallow color literals in styles; use variables or theme | — | | no-inline-styles | Disallow inline style objects; prefer StyleSheet.create | — | | no-raw-text | Require text inside <Text> (or allowed components) | — | | no-single-element-style-arrays | Disallow single-element style arrays (style={[x]}) | ✅ | | no-unused-styles | Report unused styles from StyleSheet.create | ✅ | | sort-styles | Enforce order of class names and style properties | ✅ |

Each rule is documented in the docs folder with examples and options.

Scripts

| Command | Description | | ---------------- | ----------------------------- | | npm run build | Compile TypeScript to dist/ | | npm run lint | Run Oxlint | | npm run format | Run Oxlint with --fix | | npm test | Run tests |

License

MIT