@react-three/eslint-plugin

@react-three/eslint-plugin

An ESLint plugin which provides lint rules for @react-three/fiber.

Installation

npm install @react-three/eslint-plugin --save-dev

Configuration

Use the recommended config to get reasonable defaults:

"extends": [
  "plugin:@react-three/recommended"
]

If you do not use a config you will need to specify individual rules and add extra configuration.

Add "@react-three" to the plugins section.

"plugins": [
  "@react-three"
]

Enable the rules that you would like to use.

"rules": {
  "@react-three/no-clone-in-frame-loop": "error"
}

Rules

✅ Enabled in the recommended configuration.
🔧 Automatically fixable by the --fix CLI option.
💡 Manually fixable by editor suggestions.

Rule	Description	✅	🔧	💡
no-clone-in-loop	Disallow cloning vectors in the frame loop which can cause performance problems.	✅
no-new-in-loop	Disallow instantiating new objects in the frame loop which can cause performance problems.	✅

Shareable configs

Recommended

This plugin exports a recommended configuration that enforces rules appropriate for everyone using React Three Fiber.

"extends": [
  "plugin:@react-three/recommended"
]

All

This plugin also exports an all configuration that includes every available rule.

"extends": [
  "plugin:@react-three/all"
]