eslint no-extra-semi 관련 질문

안녕하세요. eslint 강의를 듣고 있습니다. 답변해주시면 감사하겠습니다!

버전은 아래와 같습니다.

"@eslint/js": "^9.9.1",     
"@stylistic/eslint-plugin-js": "^2.6.4",     
"webpack": "^5.93.0",     
"webpack-cli": "^5.1.4"

eslint 공식홈에 no-extra-semi 사용법을 확인하면 아래와 같이 나와있습니다.

https://eslint.org/docs/latest/rules/no-extra-semi#rule-details

This rule was deprecated in ESLint v8.53.0. Please use the corresponding rule in @stylistic/eslint-plugin-js.

8.53.0 버전부터 deprecated가 되어서 stylistic 플러그인을 사용해서 쓰라고 되어 있습니다. 그래서 아래와 같이 설정을 했습니다.

// eslint.config.js
import js from "@eslint/js";
import stylisticJs from '@stylistic/eslint-plugin-js'

export default [
    js.configs.recommended,

    {
        plugins: {
          '@stylistic/js': stylisticJs,
        },
    }
];

그런데, no-extra-semi rule이 동작을 하지 않고 아래와 같이 rules안에 명시를 해줘야만 동작을 합니다. 플러그인만 명시하면 되는게 아니라 사용할 rule을 하나하나 명시해줘야만 하는건가요?

// eslint.config.js
import js from "@eslint/js";
import stylisticJs from '@stylistic/eslint-plugin-js'

export default [
    js.configs.recommended,

    {
        plugins: {
          '@stylistic/js': stylisticJs,
        },
        rules: {
            "@stylistic/js/no-extra-semi": "error"
        }
    }
];

그리고 추가적으로 궁금한 것은 deprecated 되었다고 했는데 왜 아래와 같이 eslint에서 "no-extra-semi" 를 사용할 수 있는걸까요?

// eslint.config.js
import js from "@eslint/js";
import stylisticJs from '@stylistic/eslint-plugin-js'

export default [
    js.configs.recommended,

    {
        rules: {
            "no-extra-semi": "error"
        }
    }
];