in nuxt 4 how to add vue/component-tags-order rule?

[Hetari]

In a Nuxt 4 project using ESLint module, how can I enable and configure the Vue ESLint rule vue/component-tags-order so that my <script setup> tag comes first, then <template>, then <style> in .vue files?

I already have eslint.config.mjs with withNuxt(), but when I try to add:

// @ts-check
import withNuxt from './.nuxt/eslint.config.mjs';
import prettierPlugin from 'eslint-plugin-prettier';

export default withNuxt().append({
  plugins: {
    prettier: prettierPlugin,
  },
  rules: {
    'no-console': 'warn',
    semi: ['error', 'always'],
    'vue/html-self-closing': 'off',
    'vue/component-tags-order': [
      'error',
      { order: ['script', 'template', 'style'] },
    ],
  },
});

when I run bun lint:fix I get this error:

Oops! Something went wrong! :(

ESLint: 9.36.0

TypeError: Key "rules": Key "vue/component-tags-order": Could not find "component-tags-order" in plugin "vue".

how to fix that?