Testing with Vitest (Preparation Part 1)

What is Vitest

Vitest is a next-generation testing framework closely integrated with Vite, widely used in frontend development. It is characterized by fast startup and execution, greatly improving the developer experience compared to traditional tools. (ex: Jest). It allows you to write unit tests and component tests concisely, while offering powerful support for mocks, snapshots, and type definitions, making it an excellent fit for TypeScript environments. By leveraging the Vite ecosystem, tests can be executed in a browser-like environment, enabling verification that closely resembles real behavior. Furthermore, its intuitive API and rich plugin ecosystem minimize configuration effort while allowing flexible testing strategies. It is an ideal choice for projects aiming to balance development speed and quality.

Requirements for Installing Vitest

• Node.js

  • Vitest runs on Node.js, so you need to install the latest version of Node.js.

• Vite Project

• Vitest Core

  • Install as a development dependency.
  • Example command:

    npm install -D vitest
    

• Configuration File

  • Add Vitest settings to vite.config.ts.

    /// <reference types="vitest" />
    import { defineConfig } from 'vite'
    export default defineConfig({
      test: {
        globals: true,
        environment: 'jsdom',
      },
    })
    

Running Tests

• Execute Tests
  • Example command:

  npx vitest
  

Next Step

Push this to a public GitHub branch.
(Exhausted)

日本語版