Here's the updated README.md for the given package.json
, excluding Redux Toolkit:
This template provides a minimal setup for developing React applications with TypeScript, Vite, and an optimized developer experience. It includes essential libraries and tools for building modern, scalable applications.
- React 18 with TypeScript for type-safe development.
- Vite for blazing-fast development and build performance.
- React Query for advanced data fetching and state management.
- Tailwind CSS with utility-first styling and animations.
- Zod for schema validation.
- Configured with ESLint for code quality and consistent styling.
- Husky and Commitlint for enforcing conventional commit messages.
Make sure you have the following installed:
- Node.js: v16.0.0 or higher
- npm or yarn
Clone the repository and install dependencies:
git clone https://github.com/your-username/react-ts-vite-template.git
cd react-ts-vite-template
npm install
Start the development server:
npm run dev
Run ESLint to check code quality:
npm run lint
Build the project for production:
npm run build
Preview the built project:
npm run preview
For production-grade projects, enable type-aware lint rules:
-
Configure
parserOptions
ineslint.config.js
:export default tseslint.config({ languageOptions: { parserOptions: { project: ["./tsconfig.node.json", "./tsconfig.app.json"], tsconfigRootDir: import.meta.dirname, }, }, });
-
Replace
tseslint.configs.recommended
withtseslint.configs.recommendedTypeChecked
ortseslint.configs.strictTypeChecked
. -
Add React-specific linting rules:
import react from "eslint-plugin-react"; export default tseslint.config({ settings: { react: { version: "18.3" } }, plugins: { react }, rules: { ...react.configs.recommended.rules, ...react.configs["jsx-runtime"].rules, }, });
- React: Core library for building UI.
- React Query: Advanced data fetching and caching.
- Tailwind CSS: Utility-first CSS framework.
- Lucide React: Icon library for modern UIs.
- Zod: Schema validation library.
- Vite: Build tool and dev server.
- TypeScript: Type-safe JavaScript superset.
- Tailwind CSS Plugins: Includes animations and utility merging.
- Husky: Pre-commit hooks.
- Commitlint: Enforce commit message standards.
- ESLint: Code quality and linting.
This template uses Husky and Commitlint to enforce conventional commit messages.
-
Install Husky hooks:
npx husky install
-
Follow Conventional Commits when committing changes.
This template is open-source and available under the MIT License. Feel free to use and customize it as needed.