oxc-project/oxc · error · OxcDiagnostic

Components should use an ES2015 class instead of `createReac

Error message

Components should use an ES2015 class instead of `createReactClass`.

What it means

Raised by react/prefer_es6_class when configured with `always` and a component is written as an ES2015 class while the project mandates `createReactClass`. At the throw site the class form conflicts with the enforced factory style — typically adopted to use the autobinding/mixins behavior of createReactClass. expected_es6_class_diagnostic fires from run() when is_es6_component matches a class declaration/expression representing a component and the config selects the createReactClass-preferred mode.

Source

Thrown at crates/oxc_linter/src/rules/react/prefer_es6_class.rs:20

use oxc_diagnostics::OxcDiagnostic;
use oxc_macros::declare_oxc_lint;
use oxc_span::{GetSpan, Span};
use serde::Deserialize;

use crate::{
    AstNode,
    context::{ContextHost, LintContext},
    rule::{DefaultRuleConfig, Rule},
    utils::{AlwaysNever, is_es5_component, is_es6_component},
};

fn unexpected_es6_class_diagnostic(span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn("Components should use `createReactClass` instead of an ES2015 class.")
        .with_label(span)
}

fn expected_es6_class_diagnostic(span: Span) -> OxcDiagnostic {
    OxcDiagnostic::warn("Components should use an ES2015 class instead of `createReactClass`.")
        .with_label(span)
}

#[derive(Debug, Default, Clone, Deserialize)]
pub struct PreferEs6Class(AlwaysNever);

declare_oxc_lint!(
    /// ### What it does
    ///
    /// React offers you two ways to create traditional components: using the
    /// `create-react-class` package or the newer ES2015 class system.
    ///
    /// Note that function components are preferred over class components in modern React,
    /// and it is _especially_ discouraged to use `createReactClass` in modern React.
    ///
    /// ### Why is this bad?
    ///
    /// This rule enforces a consistent React class style.

View on GitHub (pinned to e1e7af627c)

Solutions

  1. Rewrite the component as an ES2015 class extending React.Component.
  2. Convert it to a function component if lifecycle features are unused.
Defensive patterns

Strategy: validation

When it happens

Trigger: Thrown at crates/oxc_linter/src/rules/react/prefer_es6_class.rs:20 when the library encounters an invalid state.

Common situations: See trigger scenarios.


AI-assisted analysis of oxc-project/oxc@e1e7af627c (2026-08-20). Data as JSON: /api/errors/8b673652a1e84e03. Report an issue: GitHub.