refactor: apply lints from @nuxtjs/eslint-config-typescript v11 (#7114

)

Co-authored-by: Pooya Parsa <pooya@pi0.io>

docs/.eslintrc

@@ -3,5 +3,8 @@
     "import/ignore": [
       "vue"
     ]
+  },
+  "rules": {
+    "vue/no-v-text-v-html-on-component": "off"
   }
 }

examples/experimental/reactivity-transform/components/label.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-const { count } = defineProps<{
+const props = defineProps<{
   count: number,
 }>()
-const doubled = $computed(() => count * 2)
+const doubled = $computed(() => props.count * 2)
 </script>
 
 <template>

package.json

@@ -47,7 +47,7 @@
     "unbuild": "^0.8.9"
   },
   "devDependencies": {
-    "@nuxtjs/eslint-config-typescript": "^10.0.0",
+    "@nuxtjs/eslint-config-typescript": "^11.0.0",
     "@types/node": "^16.11.56",
     "@types/rimraf": "^3",
     "@unocss/reset": "^0.45.13",

packages/nuxt/src/app/components/nuxt-error-page.vue

@@ -9,10 +9,8 @@ const props = defineProps({
   error: Object
 })
 
-const error = props.error
-
 // TODO: extract to a separate utility
-const stacktrace = (error.stack || '')
+const stacktrace = (props.error.stack || '')
   .split('\n')
   .splice(1)
   .map((line) => {
@@ -29,12 +27,12 @@ const stacktrace = (error.stack || '')
   }).map(i => `<span class="stack${i.internal ? ' internal' : ''}">${i.text}</span>`).join('\n')
 
 // Error page props
-const statusCode = Number(error.statusCode || 500)
+const statusCode = Number(props.error.statusCode || 500)
 const is404 = statusCode === 404
 
-const statusMessage = error.statusMessage ?? (is404 ? 'Page Not Found' : 'Internal Server Error')
-const description = error.message || error.toString()
-const stack = process.dev && !is404 ? error.description || `<pre>${stacktrace}</pre>` : undefined
+const statusMessage = props.error.statusMessage ?? (is404 ? 'Page Not Found' : 'Internal Server Error')
+const description = props.error.message || props.error.toString()
+const stack = process.dev && !is404 ? props.error.description || `<pre>${stacktrace}</pre>` : undefined
 
 // TODO: Investigate side-effect issue with imports
 const _Error404 = defineAsyncComponent(() => import('@nuxt/ui-templates/templates/error-404.vue'))

packages/nuxt/src/app/index.ts

@@ -9,6 +9,7 @@ export * from './config'
 export type { PageMeta } from '../pages/runtime'
 // eslint-disable-next-line import/no-restricted-paths
 export type { MetaObject } from '../head/runtime'
+// eslint-disable-next-line import/no-restricted-paths
 export { useHead, useMeta } from '#head'
 
 export const isVue2 = false

packages/nuxt/src/core/runtime/nitro/renderer.ts

@@ -4,8 +4,9 @@ import type { Manifest } from 'vite'
 import { getQuery } from 'h3'
 import devalue from '@nuxt/devalue'
 import { renderToString as _renderToString } from 'vue/server-renderer'
-import type { NuxtApp, NuxtSSRContext } from '#app'
 import { useRuntimeConfig, useNitroApp, defineRenderHandler } from '#internal/nitro'
+// eslint-disable-next-line import/no-restricted-paths
+import type { NuxtApp, NuxtSSRContext } from '#app'
 
 // @ts-ignore
 import { buildAssetsURL } from '#paths'

packages/nuxt/src/head/runtime/components.ts

@@ -67,6 +67,7 @@ const globalProps = {
 
 // <script>
 export const Script = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Script',
   inheritAttrs: false,
   props: {
@@ -119,6 +120,7 @@ export const NoScript = defineComponent({
 
 // <link>
 export const Link = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Link',
   inheritAttrs: false,
   props: {
@@ -154,6 +156,7 @@ export const Link = defineComponent({
 
 // <base>
 export const Base = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Base',
   inheritAttrs: false,
   props: {
@@ -168,6 +171,7 @@ export const Base = defineComponent({
 
 // <title>
 export const Title = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Title',
   inheritAttrs: false,
   setup: setupForUseMeta((_, { slots }) => {
@@ -183,6 +187,7 @@ export const Title = defineComponent({
 
 // <meta>
 export const Meta = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Meta',
   inheritAttrs: false,
   props: {
@@ -199,6 +204,7 @@ export const Meta = defineComponent({
 
 // <style>
 export const Style = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Style',
   inheritAttrs: false,
   props: {
@@ -230,13 +236,15 @@ export const Style = defineComponent({
 
 // <head>
 export const Head = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Head',
   inheritAttrs: false,
   setup: (_props, ctx) => () => ctx.slots.default?.()
 })
 
 // <html>
 export const Html = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Html',
   inheritAttrs: false,
   props: {
@@ -250,6 +258,7 @@ export const Html = defineComponent({
 
 // <body>
 export const Body = defineComponent({
+  // eslint-disable-next-line vue/no-reserved-component-names
   name: 'Body',
   inheritAttrs: false,
   props: globalProps,

packages/nuxt/src/pages/runtime/page.ts

@@ -66,7 +66,9 @@ const Component = defineComponent({
   props: ['routeProps', 'pageKey', 'hasTransition'],
   setup (props) {
     // Prevent reactivity when the page will be rerendered in a different suspense fork
+    // eslint-disable-next-line vue/no-setup-props-destructure
     const previousKey = props.pageKey
+    // eslint-disable-next-line vue/no-setup-props-destructure
     const previousRoute = props.routeProps.route
 
     // Provide a reactive route within the page

test/basic.test.ts

@@ -3,6 +3,7 @@ import { describe, expect, it } from 'vitest'
 import { joinURL } from 'ufo'
 // import { isWindows } from 'std-env'
 import { setup, fetch, $fetch, startServer } from '@nuxt/test-utils'
+// eslint-disable-next-line import/order
 import { expectNoClientErrors, renderPage } from './utils'
 
 await setup({

test/fixtures/basic/components/SugarCounter.vue

@@ -1,10 +1,10 @@
 <script setup lang="ts">
-const { count } = defineProps<{
+const props = defineProps<{
   count: number,
 }>()
 // eslint-disable-next-line prefer-const
 let multiplier = $ref(2)
-const doubled = $computed(() => count * multiplier)
+const doubled = $computed(() => props.count * multiplier)
 </script>
 
 <template>

test/fixtures/basic/types.ts

@@ -6,6 +6,7 @@ import type { AppConfig } from '@nuxt/schema'
 import { NavigationFailure, RouteLocationNormalizedLoaded, RouteLocationRaw, useRouter as vueUseRouter } from 'vue-router'
 import { defineNuxtConfig } from '~~/../../../packages/nuxt/src'
 import type { NavigateToOptions } from '~~/../../../packages/nuxt/dist/app/composables/router'
+// eslint-disable-next-line import/order
 import { isVue3 } from '#app'
 import { useRouter } from '#imports'
 

test/utils.ts

@@ -1,5 +1,5 @@
-import { getBrowser, url, useTestContext } from '@nuxt/test-utils'
 import { expect } from 'vitest'
+import { getBrowser, url, useTestContext } from '@nuxt/test-utils'
 
 export async function renderPage (path = '/') {
   const ctx = useTestContext()