Try @eslint-react/kit@beta
logoESLint React

no-component-will-mount

Replaces usage of 'componentWillMount' with 'UNSAFE_componentWillMount'.

Full Name in eslint-plugin-react-x

react-x/no-component-will-mount

Full Name in @eslint-react/eslint-plugin

@eslint-react/no-component-will-mount

Features

🔄

Presets

x recommended recommended-typescript recommended-type-checked strict strict-typescript strict-type-checked

Rule Details

This API was renamed from componentWillMount to UNSAFE_componentWillMount. The old name has been deprecated. In a future major version of React, only the new name will work.

Examples

Using the deprecated lifecycle name

If your codebase still references componentWillMount, you should rename it to UNSAFE_componentWillMount to stay compatible with future React versions. Eventually, consider migrating side effects to componentDidMount or function components with useEffect.

// Problem: Using the deprecated componentWillMount name
import React from "react";

interface MyComponentProps {
  name: string;
}

class MyComponent extends React.Component<MyComponentProps> {
  componentWillMount() {
    // ...
  }
}
// Recommended: Use UNSAFE_componentWillMount instead of the old name
import React from "react";

interface MyComponentProps {
  name: string;
}

class MyComponent extends React.Component<MyComponentProps> {
  UNSAFE_componentWillMount() {
    // ...
  }
}

Versions

Resources

Further Reading

On this page