React Vite Template Generator

🚀 A CLI tool to quickly scaffold a React project with Vite, including a customizable folder structure and optional tools like TailwindCSS, ESLint, and React Router.

📦 Installation

npm install -g create-react-vite-template

Or run directly with:

npx create-react-vite-template <project-name>

🛠️ Usage

npx create-react-vite-template my-react-app

Follow the interactive prompts:

• Choose a template: Basic, Advanced, Full-Stack
• Install TailwindCSS? yes/no
• Install ESLint? yes/no
• Install React Router? yes/no

📂 Folder Structure

A typical project structure generated by this tool looks like this:

/src
  ├── assets/       # Static assets (images, fonts, etc.)
  ├── components/   # Reusable UI components
  ├── pages/        # Main pages
  ├── hooks/        # Custom React hooks
  ├── context/      # Global context providers
  ├── services/     # API calls and external services
  ├── styles/       # Global styles
  ├── App.jsx       # Main App component
  ├── main.jsx      # Entry point
  ├── index.css     # Base styles

🚀 Features

• Interactive CLI: Choose project options using arrow keys.
• Custom Templates: Basic, Advanced, or Full-Stack setup.
• Optional Tools:
  • 📦 TailwindCSS
  • 🛡️ ESLint
  • 🔄 React Router
• Predefined Folder Structure: Ready for scalable projects.
• Clear Instructions: Post-setup guidance included.

✅ Examples

Create a new project with all tools enabled:

npx create-react-vite-template my-advanced-app

📝 Scripts

After creating your project, navigate to the folder and run:

cd my-react-app
npm install
npm run dev

💻 Requirements

• Node.js: >= v14.x
• npm: >= v7.x

🐞 Troubleshooting

Error with Chalk and ESM?

Ensure you're using a supported Node.js version (>= v14). If the error persists, run:

npm install chalk inquirer