react-vite-component-template

Template for building a React component library, with Vite, TypeScript and Storybook.

Check my post about this repository here.

Features

• ⚛️ React component library with TypeScript.

• 🏗️ Vite as development environment.

• 🌳 Tree shaking, for not distributing dead-code.

• 📚 Storybook for live viewing the components.

• 🎨 PostCSS for processing our CSS.

• 🖌️ CSS Modules in development, compiled CSS for production builds.

• 🧪 Testing with Vitest and React Testing Library.

• ✅ Code quality tools with ESLint, Prettier and Stylelint.

🤖 Scripts

Script	Function
build	Build the dist, with types declarations, after checking types with TypeScript.
lint	Lint the project with Eslint.
lint:fix	Lint and fix the project with Eslint.
format	Check the project format with Prettier.
format:fix	Format the project code with Prettier.
stylelint	Lint the styles code with Stylelint.
stylelint:fix	Lint and fix the styles code with Stylelint.
storybook	Start a Storybook development server.
build-storybook	Build the Storybook dist.
test	Run the tests with Vitest using jsdom and starts a Vitest UI dev server.
coverage	Generate a coverage report, with v8.