vamoacodear / create-custom-vite

🚧 CLI para crear proyecto Vite basado en los template oficiales, donde podes configurar herramientas extras como ESLint, Prettier, Husky, etc.

create-custom-vite

Change lang: EN

CLI en construcción 🚧 para crear proyecto de Vite, que por el momento utiliza como base los templates oficiales: react o react-ts.

Podes elegir entre estas herramientas, algunas tienen opciones de configuración extra:

Nombre	Configuración	Recomendado	Type
ESLint	Recomendada - Standar	✅	Linter/Formatter
Prettier	Default - Ninguna	✅	Formatter
Husky			Git Hooks
Lint Staged			Git Linter
React router			Router
Wouter			Router

De esta manera no perdes tiempo y podes empezar a codear! 🤓

NOTA: Las opciones recomendadas (✅), están tildadas por defecto para que no las tengas que seleccionar. Mejoran tu entorno de desarrollo, ocupandose del formato del código y marcando errores. Podes destildarlas

Configuraciones extra

ESLint

Recomendada	Standar
✔ How would you like to use ESLint? · problems	Info
✔ What type of modules does your project use? · esm
✔ Which framework does your project use? · react
✔ Does your project use TypeScript? · No 🚧 / Yes
✔ Where does your code run? · browser
✔ What format do you want your config file to be in? · JavaScript

Prettier

Default	Ninguna
Info	{}

Como usar

1. Ejecuta el siguiente comando para crear tu proyecto:

 npx create-custom-vite

---

ccv_es.mp4

---

2. Responde las preguntas con (y/n) o elegiendo una de las opciones.

💡 Si la opción esta tildada por defecto, podes utilizar Enter

3. Entra a la carpeta de tu nuevo proyecto y en la terminal escribí el comando npm run dev para verificar que funcione.

4. Podes dejar las configuraciones por defecto o modificarlas a tu gusto 🥳

Pedir cambios o avisar de un error

Para esto podes abrir un issue con lo que te gustaría agregar al proyecto, error o configuraciones extras que quisieras que se puedan seleccionar.

Herramientas en tu nuevo proyecto ✨

Dependiendo del template seleccionado:

• React
• React + TypeScript

Dependiendo de las respuestas:

• Prettier

• ESLint con:

  • Plugins:
    • eslint:recommended
    • plugin:react/recommended
  • Reglas:
    • react-in-jsx-scope

• Husky

• Lint Staged

Routers:

• React Router
• Wouter

Autora

👩🏻‍💻 Noelia Donato

Feedback

Si tenes algún feedback, escribí a [email protected] 🤗

Colaboradorxs

Licencia

MIT