React Vitest Template

A starter template for building React apps with Vite. Includes Vitest for unit testing and a hefty .gitignore file.

Requirements

Node 20 or greater.

Usage

mkdir your-app-name
cd your-app-name
npx degit criesbeck/react-vitest
npm install

If the third step hangs after printing > cloned criesbeck/react-vitest#HEAD, just control-C to exit then run npm install.

Test

Verify that the initial app works. Run

npm start

and open the URL displayed.

Verify that the unit tests work with

npm test

Two tests should run and pass.

Scripts

package.json defines the following scripts:

Script	Description
npm start	Runs the app in the development mode.
npm run dev	Runs the app in the development mode.
npm run build	Builds the app for production to the dist folder.
npm run serve	Serves the production build from the dist folder.
npm test	Starts a Jest-like test loop
npm run coverage	Runs the tests, displays code coverage results

Git

If everything is working, set up your local and remote repositories.

Folder Structure

your-app-name
├── node_modules
├── public
│   ├── favicon.svg
│   └── robots.txt
└── src
    ├── App.css
    ├── App.jsx
    ├── index.css
    ├── index.jsx
    └── logo.svg
├── .gitignore
├── index.html
├── package.json
├── README.md
├── vite.config.js

Credits

React-Vitest built and maintained by Chris Riesbeck.

Inspired by SafdarJamal/vite-template-react. Expanded to include Vitest and some sample tests.

Thanks to Rich Harris for degit.

Gitignore file created with the Toptal tool.

License

This project is licensed under the terms of the MIT license.