Some of my plugins don't work

[dddssw]

Tell us about your environment

• ESLint version:^8.57.0
• eslint-plugin-vue version:^9.23.0
• Vue version:^3.4.21

<script setup>
watch(
  () => props.initiallist,
  (newVal) => {
    newVal.forEach((item) => {
      child.value.newSelectedItems.set(item.materialCode, item)
      amountMap.value.set(item.materialCode, item.amount)
    })
    child.value.handleSubmit()
  }
)

const disabledCode = computed(() => {
  return sceneForm.tableData.map((item) => item.materialCode)
})
</script>

According to the style guide, watch should be placed after computed, but there is no eslint prompt

// .eslintrc.cjs
/* eslint-env node */
require('@rushstack/eslint-patch/modern-module-resolution')

module.exports = {
  root: true,
  'extends': [
    'plugin:vue/vue3-essential',
    'plugin:vue/recommended',
    'eslint:recommended',
    '@vue/eslint-config-typescript',
    '@vue/eslint-config-prettier/skip-formatting'
  ],
  parserOptions: {
    ecmaVersion: 'latest'
  },
  rules: {
    'vue/new-line-between-multi-line-property': [
      'error',
      {
        minLineOfMultilineProperty: 2
      }
    ]
  }
}

But I see that it is in the default rules, I don't know what went wrong

However, the attribute on the component has a prompt

[waynzh]

This rule seems to mainly enforce the declaration order of the Optional API. When using the setup Composition API, there isn't a strict requirement for the order of declaration for watch and computed.

[dddssw]

@waynzh The property I set is also invalid under the setup syntax sugar Maybe this isn't supported?

[waynzh]

You could use the playground to provide a reproduction of this issue.

[dddssw]

@waynzh yes,this is a example example

These two rules did not take effect

• https://cn.vuejs.org/style-guide/rules-recommended.html#component-instance-options-order
• https://cn.vuejs.org/style-guide/rules-recommended.html#empty-lines-in-component-instance-options

[FloEdelmann]

Both vue/order-in-components and vue/new-line-between-multi-line-property only target components using the Option API, not <script setup>.

For vue/order-in-components, the request to also apply it for components using the Composition API was rejected, see https://github.com/vuejs/eslint-plugin-vue/issues/2055#issuecomment-1480909340. Also note that the style guide rule you linked does not mention whether it applies to Options API or Composition API.

For vue/new-line-between-multi-line-property, I also don't think it makes sense to extend it to components using the Composition API. It is quite specific to adding new lines between object properties. In <script setup> or in the setup() function, there are no "blocks" that can be separated by an ESLint rule. So I agree that the style guide rule should be followed manually while writing the code, but it can't be enforced by ESLint if you are using the Composition API.

So I'll close this as won't fix.

[dddssw]

It is best to mark it in the document to avoid others having the same problem

[FloEdelmann]

PRs to improve the docs are always welcome :slightly_smiling_face: