fix: eslint vitest

Author: qinsong77

.eslintrc.cjs

@@ -8,7 +8,7 @@ module.exports = {
   extends: [
     // 'next/core-web-vitals',
     'next',
-    'next/typescript',
+    'next/typescript', // or use 'plugin:@typescript-eslint/recommended-type-checked'
     'plugin:tailwindcss/recommended',
     'plugin:prettier/recommended',
   ],
@@ -31,7 +31,7 @@ module.exports = {
       files: ['**/*.test.ts', '**/*.test.tsx'],
       excludedFiles: ['e2e/**'],
       extends: [
-        'plugin:vitest/legacy-recommended',
+        'plugin:@vitest/legacy-recommended',
         'plugin:jest-dom/recommended',
         'plugin:testing-library/react',
       ],

__tests__/page.test.tsx

@@ -1,7 +1,7 @@
-import { render, screen, within } from '@testing-library/react'
+import { render, screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
-import { describe, expect, it } from 'vitest'
 
+// import { describe, expect, it } from 'vitest'
 import Page from '../app/page'
 describe('Home component', () => {
   it('renders correctly', () => {

__tests__/setup.ts

@@ -1 +1,8 @@
-import '@testing-library/jest-dom'
+import '@testing-library/jest-dom/vitest'
+
+import { cleanup } from '@testing-library/react'
+import { afterEach } from 'vitest'
+
+afterEach(() => {
+  cleanup()
+})

next.config.js

@@ -14,7 +14,7 @@ const nextConfig = bundleAnalyzer({
   output: 'standalone',
   distDir: isProd ? 'dist' : '.next',
   cacheMaxMemorySize: 60 * 1024,
-  // fix all before production. Now it slow the develop speed.
+  // todo: fix it all before production. Now it slow the develop speed.
   eslint: {
     // Warning: This allows production builds to successfully complete even if
     // your project has ESLint errors.

package.json

@@ -74,6 +74,7 @@
     "@types/react-dom": "^18.3.0",
     "@vitejs/plugin-react": "^4.3.1",
     "@vitest/coverage-v8": "^2.1.1",
+    "@vitest/eslint-plugin": "^1.1.4",
     "autoprefixer": "^10.4.20",
     "cross-env": "^7.0.3",
     "eslint": "^8",
@@ -85,7 +86,6 @@
     "eslint-plugin-simple-import-sort": "^12.1.1",
     "eslint-plugin-tailwindcss": "^3.17.4",
     "eslint-plugin-testing-library": "^6.3.0",
-    "eslint-plugin-vitest": "^0.5.4",
     "husky": "^9.1.6",
     "jsdom": "^25.0.0",
     "lint-staged": "^15.2.10",

pnpm-lock.yaml

@@ -12,6 +12,7 @@
     "isolatedModules": true,
     "jsx": "preserve",
     "incremental": true,
+    "types": ["vitest/globals"],
     "plugins": [
       {
         "name": "next"

tsconfig.json

@@ -16,7 +16,7 @@ export default defineConfig({
     setupFiles: './__tests__/setup.ts',
     // you might want to disable it, if you don't have tests that rely on CSS
     // since parsing CSS is slow
-    css: true,
+    // css: true,
     coverage: {
       // todo check coverage
       include: ['**/*.test.ts'],