From 9f1fc595a4164b5d650908a0490140d4fbfcb998 Mon Sep 17 00:00:00 2001 From: Takanori Sugita <38074428+sugitata@users.noreply.github.com> Date: Wed, 27 Nov 2024 21:45:44 +0900 Subject: [PATCH 01/14] Fix detect Nuxt3 defineNuxtComponent (#2311) --- lib/utils/index.js | 14 ++++- tests/lib/rules/no-undef-components.js | 15 +++++ tests/lib/rules/order-in-components.js | 78 ++++++++++++++++++++++++++ tests/lib/utils/vue-component.js | 6 ++ 4 files changed, 110 insertions(+), 3 deletions(-) diff --git a/lib/utils/index.js b/lib/utils/index.js index 167edf208..8d0dfa80d 100644 --- a/lib/utils/index.js +++ b/lib/utils/index.js @@ -1581,7 +1581,7 @@ module.exports = { * Get the Vue component definition type from given node * Vue.component('xxx', {}) || component('xxx', {}) * @param {ObjectExpression} node Node to check - * @returns {'component' | 'mixin' | 'extend' | 'createApp' | 'defineComponent' | null} + * @returns {'component' | 'mixin' | 'extend' | 'createApp' | 'defineComponent' | 'defineNuxtComponent' | null} */ getVueComponentDefinitionType, /** @@ -2755,7 +2755,7 @@ function isVueComponentFile(node, path) { * Get the Vue component definition type from given node * Vue.component('xxx', {}) || component('xxx', {}) * @param {ObjectExpression} node Node to check - * @returns {'component' | 'mixin' | 'extend' | 'createApp' | 'defineComponent' | null} + * @returns {'component' | 'mixin' | 'extend' | 'createApp' | 'defineComponent' | 'defineNuxtComponent' | null} */ function getVueComponentDefinitionType(node) { const parent = getParent(node) @@ -2811,6 +2811,12 @@ function getVueComponentDefinitionType(node) { const isDestructedVueComponent = isObjectArgument(parent) return isDestructedVueComponent ? 'defineComponent' : null } + if (callee.name === 'defineNuxtComponent') { + // for Nuxt 3.x + // defineNuxtComponent({}) + const isDestructedVueComponent = isObjectArgument(parent) + return isDestructedVueComponent ? 'defineNuxtComponent' : null + } } } @@ -2955,7 +2961,9 @@ function isSFCObject(context, node) { } const { callee } = parent if ( - (callee.type === 'Identifier' && callee.name === 'defineComponent') || + (callee.type === 'Identifier' && + (callee.name === 'defineComponent' || + callee.name === 'defineNuxtComponent')) || (callee.type === 'MemberExpression' && callee.object.type === 'Identifier' && callee.object.name === 'Vue' && diff --git a/tests/lib/rules/no-undef-components.js b/tests/lib/rules/no-undef-components.js index e9992e39d..37a3bec68 100644 --- a/tests/lib/rules/no-undef-components.js +++ b/tests/lib/rules/no-undef-components.js @@ -269,6 +269,21 @@ tester.run('no-undef-components', rule, { } ] }, + { + filename: 'test.vue', + code: ` + + + ` + }, { filename: 'test.vue', code: ` diff --git a/tests/lib/rules/order-in-components.js b/tests/lib/rules/order-in-components.js index 2cbe721c5..130a319b0 100644 --- a/tests/lib/rules/order-in-components.js +++ b/tests/lib/rules/order-in-components.js @@ -234,6 +234,84 @@ ruleTester.run('order-in-components', rule, { } ] }, + { + filename: 'test.vue', + code: ` + import { defineComponent } from 'vue' + export default defineComponent({ + name: 'app', + data () { + return { + msg: 'Welcome to Your Vue.js App' + } + }, + props: { + propA: Number, + }, + }) + `, + output: ` + import { defineComponent } from 'vue' + export default defineComponent({ + name: 'app', + props: { + propA: Number, + }, + data () { + return { + msg: 'Welcome to Your Vue.js App' + } + }, + }) + `, + languageOptions, + errors: [ + { + message: + 'The "props" property should be above the "data" property on line 5.', + line: 10 + } + ] + }, + { + filename: 'test.vue', + code: ` + import { defineNuxtComponent } from '#app' + export default defineNuxtComponent({ + name: 'app', + data () { + return { + msg: 'Welcome to Your Vue.js App' + } + }, + props: { + propA: Number, + }, + }) + `, + output: ` + import { defineNuxtComponent } from '#app' + export default defineNuxtComponent({ + name: 'app', + props: { + propA: Number, + }, + data () { + return { + msg: 'Welcome to Your Vue.js App' + } + }, + }) + `, + languageOptions, + errors: [ + { + message: + 'The "props" property should be above the "data" property on line 5.', + line: 10 + } + ] + }, { filename: 'test.jsx', code: ` diff --git a/tests/lib/utils/vue-component.js b/tests/lib/utils/vue-component.js index 8970672ad..12fcd904f 100644 --- a/tests/lib/utils/vue-component.js +++ b/tests/lib/utils/vue-component.js @@ -325,6 +325,12 @@ function invalidTests(ext) { code: `export default defineComponent({})`, languageOptions, errors: [makeError(1)] + }, + { + filename: `test.${ext}`, + code: `export default defineNuxtComponent({})`, + languageOptions, + errors: [makeError(1)] } ] } From 748d08c6dfe3096ce8e49800bfddd0b46db43b65 Mon Sep 17 00:00:00 2001 From: Flo Edelmann Date: Sat, 30 Nov 2024 06:45:32 +0100 Subject: [PATCH 02/14] Add `vue/block-order` to recommended configs (#2627) --- docs/rules/block-order.md | 1 + docs/rules/component-tags-order.md | 1 - docs/rules/index.md | 3 +-- lib/configs/flat/vue2-recommended.js | 2 +- lib/configs/flat/vue3-recommended.js | 2 +- lib/configs/vue2-recommended.js | 2 +- lib/configs/vue3-recommended.js | 2 +- lib/rules/block-order.js | 2 +- lib/rules/component-tags-order.js | 2 +- 9 files changed, 8 insertions(+), 9 deletions(-) diff --git a/docs/rules/block-order.md b/docs/rules/block-order.md index 314d6c5a8..3fe0c06c8 100644 --- a/docs/rules/block-order.md +++ b/docs/rules/block-order.md @@ -10,6 +10,7 @@ since: v9.16.0 > enforce order of component top-level elements +- :gear: This rule is included in all of `"plugin:vue/vue3-recommended"`, `*.configs["flat/recommended"]`, `"plugin:vue/recommended"` and `*.configs["flat/vue2-recommended"]`. - :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fix-problems) can automatically fix some of the problems reported by this rule. ## :book: Rule Details diff --git a/docs/rules/component-tags-order.md b/docs/rules/component-tags-order.md index 4f1397bd8..c36f93f95 100644 --- a/docs/rules/component-tags-order.md +++ b/docs/rules/component-tags-order.md @@ -11,7 +11,6 @@ since: v6.1.0 > enforce order of component top-level elements - :no_entry_sign: This rule was **deprecated** and replaced by [vue/block-order](block-order.md) rule. -- :gear: This rule is included in all of `"plugin:vue/vue3-recommended"`, `*.configs["flat/recommended"]`, `"plugin:vue/recommended"` and `*.configs["flat/vue2-recommended"]`. - :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fix-problems) can automatically fix some of the problems reported by this rule. ## :book: Rule Details diff --git a/docs/rules/index.md b/docs/rules/index.md index 598c7a097..790256522 100644 --- a/docs/rules/index.md +++ b/docs/rules/index.md @@ -177,7 +177,7 @@ Rules in this category are enabled for all presets provided by eslint-plugin-vue | Rule ID | Description | | | |:--------|:------------|:--:|:--:| | [vue/attributes-order] | enforce order of attributes | :wrench: | :three::two::hammer: | -| [vue/component-tags-order] | enforce order of component top-level elements | :wrench::no_entry_sign: | :three::two::hammer: | +| [vue/block-order] | enforce order of component top-level elements | :wrench: | :three::two::hammer: | | [vue/no-lone-template] | disallow unnecessary `