A modern React application built with Mantine UI components, Vite, and TypeScript, managed with Bun.

This template comes with the following features:

• PostCSS with mantine-postcss-preset
• TypeScript
• Storybook
• Vitest setup with React Testing Library
• ESLint setup with eslint-config-mantine

• Bun installed on your system

Install all dependencies:

bun install

Start the development server:

bun run dev

The app will be available at http://localhost:5173

• bun run dev – Start development server with hot reload
• bun run build – Build production version of the app to dist/ folder
• bun run preview – Locally preview the production build

• bun run test – Run all tests once
• bun run test:watch – Run tests in watch mode (re-runs on file changes)
• bun run test:ui – Run tests with Vitest UI interface
• bun run typecheck – Check TypeScript types without emitting files

• bun run lint – Run ESLint and Stylelint
• bun run lint:fix – Auto-fix ESLint and Stylelint issues
• bun run format – Format all files with Prettier
• bun run format:check – Check if files are formatted correctly
• bun run validate – Run full validation (typecheck + format + lint + test + build)

• bun run storybook – Start Storybook dev server at http://localhost:6006
• bun run storybook:build – Build production Storybook bundle to storybook-static/

To test how your app will behave in production:

# Build the production version
bun run build

# Preview the built app locally
bun run preview

The preview server will start at http://localhost:4173 (or another available port).

You can also serve the dist/ folder with any static file server:

# Build first
bun run build

# Serve the dist folder
cd dist
bunx serve

vite-template/
├── src/                  # Application source code
│   ├── components/       # React components
│   ├── pages/           # Page components
│   └── assets/          # Images, fonts, etc.
├── public/              # Static files served directly
├── test-utils/          # Testing utilities and setup
├── .storybook/          # Storybook configuration
└── dist/                # Production build output (generated)

After running bun run build, the dist/ folder contains your production-ready app. Deploy this folder to any static hosting service:

• Vercel: bunx vercel deploy
• Netlify: bunx netlify deploy --prod --dir=dist
• GitHub Pages: Push dist/ folder contents to gh-pages branch

• Mantine Documentation
• Vite Documentation
• Bun Documentation
• React Documentation