A modern, fast starter template using Vite, React, and Tailwind CSS. Includes built-in linting, formatting, and best practices for rapid development.
- β‘οΈ Instant dev server with Vite
- π¨ Tailwind CSS
- βοΈ React
- π§Ό HTMLHint, ESLint, Stylelint
- ποΈ Prettier + Tailwind plugin
- π οΈ Ready-to-use scripts:
dev
,build
,preview
- π¦ Minimal, production-ready config
- π§© Easily extendable toolchain
src/
β Source files (HTML, JS, SCSS, assets)dist/
β Production build outputindex.html
β Entry HTML filevite.config.js
β Vite configeslint.config.js
,.stylelintrc
,.htmlhintrc
β Lint configsprettier.config.mjs
β Formatting configpackage.json
β Scripts & dependencies
npx degit marcop135/vite-react-tailwind-lint my-app
cd my-app
npm install
npm run dev
npm run dev # Start dev server
npm run build # Build for production
npm run preview # Preview production build
npm run lint # Lint JS, JSX, TS, TSX, CSS, SCSS, HTML, and MD files
npm run format # Format html, css, js, jsx, jsx, ts, tsx, and MD files
Now edit the following files to start customizing:
index.html
β Main HTML filesrc/main.jsx
β React entry point
Includes:
eslint
β Lint JavaScriptstylelint
β Lint CSS/SCSShtmlhint
β Lint HTML/JSXprettier
β Format code
npm run lint
npm run format
Linting & Formatting Commands:
# Lint all JSX files in src/
npx eslint "src/**/*.{js,jsx,ts,tsx}"
# Lint all CSS files in src/
npx stylelint "src/*.css"
# Lint all HTML files in the project (root, src/, dist/, etc.)
npx htmlhint "**/*.html"
# Check code formatting for all JS, JSX, TS, TSX, CSS, SCSS, HTML, and Markdown files in src/
npx prettier --check "src/**/*.{js,jsx,ts,tsx,css,scss,html,md}"
Contributions welcome! Open issues or submit PRs.
Licensed under the MIT License.