⚡ Reactivite ⚡

A minimal starter for React with TypeScript support with out of the box formatting and linting. Utilizes the blazing fast Vite build tool.

Features

• React with TypeScript using the Vite build tool.
• Supports Sass with automatic type declaration file creation when using SCSS Modules.
• Utilizes PostCSS with the Autoprefixer plugin to optimize CSS and SCSS code.
• Supports TypeScript absolute imports.
• Uses ESLint (with ESLint AirBnB Config), stylelint and Prettier for code linting and formatting.
• Runs pre-commit command using Husky to run lint-staged.
• Unit and integration testing using Vitest and Testing Library.
• Comes with a light VSCode setting file to enable formatting on save for JSON, JavaScript, TypeScript, TypeScript React, and Markdown files.
• Recommends useful extensions to install when using VSCode as your editor.

Getting Started

Either use this repo as a GitHub template or use degit to make a clean copy of this repo:

npx degit armanatz/Reactivite#master my-app

After that, navigate to your project folder and install dependencies:

// If using NPM as your package manager
npm i

// If using Yarn as your package manager
yarn

Then you can run the local development server using:

// If using NPM as your package manager
npm run dev

// If using Yarn as your package manager
yarn dev

To build your application, run:

// If using NPM as your package manager
npm build

// If using Yarn as your package manager
yarn build

Build files will be located in the dist folder once generated.

Available Scripts

• format: Formats all files with Prettier.
• lint: Type-checks all files with TypeScript, and then lints all files using ESLint and StyleLint.
• preview: Allows for a local preview of the production build of the application.
• test: Runs unit and integration tests based on file changes tracked in git using Vitest.
• test:ci: Runs all unit and integration tests in CI mode using Vitest.
• test:watch: Runs Vitest test runner in watch mode.
• validate: Runs all linting commands defined in lint, and then runs test:ci for testing.