Prefer Direct Hook Imports

Suggestion

small-rules/prefer-direct-hook-imports

Prefer importing React hooks directly instead of calling them via the React namespace.

Diagnostic Messages

preferDirectHookImport

Import `{{hookName}}` directly instead of calling `React.{{hookName}}`.

Configuration

This rule accepts one options object after the severity.

allowedHooksOptional

Hook names that are allowed to be called via React namespace.

Type

Array<string>

Default

-

environmentOptional

The React environment: 'roblox-ts' uses @rbxts/react, 'standard' uses react.

Type

"roblox-ts" | "standard"

Default

roblox-ts

{
  "jsPlugins": [
    "@pobammer-ts/small-rules"
  ],
  "rules": {
    "small-rules/prefer-direct-hook-imports": [
      "error",
      {
        "allowedHooks": [
          "value"
        ],
        "environment": "roblox-ts"
      }
    ]
  }
}

Examples

React.useState namespace call

import React from "@rbxts/react";

const [state, setState] = React.useState(false);

Direct hook import

import { useState } from "@rbxts/react";

const [state, setState] = useState(false);