.prettierrc

{
     "printWidth": 80,
     "tabWidth": 2,
     "useTabs": false,
     "semi": true,
     "singleQuote": true,
     "trailingComma": "all",
     "bracketSpacing": true,
     "arrowParens": "avoid",
     "endOfLine": "lf"
   }

README.md

Instructions

Install Prettier and the eslint-plugin-prettier plugin:

npm install -D prettier eslint-plugin-prettier

Install Vitest, JSDOM, and testing libraries:

npm install vitest jsdom @testing-library/react @testing-library/jest-dom vitest jsdom @testing-library/react @testing-library/jest-dom -D

Install Vitest, JSDOM, and testing libraries:

Add "test" script to package.json: Open your package.json file and add the following line to the "scripts" section:

"scripts": {
  "dev": "vite",
  "build": "vite build",
  "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
  "preview": "vite preview",
  "test": "vitest"
}

Run the tests: Use either of the following commands:

npm run test

or

npm test

vite.config.js

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    react()
  ],
  server: {
    open: true,
    port: 3000
  },
  test: {
    globals: true,
    environment: 'jsdom',
    setupFiles: './src/tests/setup.js',
  }
})