Cómo iniciar un proyecto React con Vite

Vite es una herramienta de tooling para el Frontend. Lo puedes agrupar en la categoría donde se encuentrar otros como Webpack, Parcel y Snowpack. Es muy útil para crear una estructura de proyecto que se pueda utilizar con React y de\ una forma muy rápida, ya que no necesitas tener que configurar nada y aprovecha el sistema de módulos de ES6 (ESModules) por lo que puede ser servido dinamicamente según lo necesite el navegador.

Crear un proyecto React con Vite.

Asegurate de tener instalado Node.js en tu equipo. Una vez lo tengas, corre los siguientes comandos:

$ npm init vite@latest <nombre-de-mi-proyecto>

Entre los diferentes frameworks que te sugiere, elige el que necesites, en nuestro caso react. Despues te pregunta si quieres utilizar TypeScript o no. Elige lo que prefieras.

✔ Project name: … vite-project
? Select a framework: › - Use arrow-keys. Return to submit.
    vanilla
    vue
❯   react
    preact
    lit-element
    svelte

? Select a variant: › - Use arrow-keys. Return to submit.
❯   react
    react-ts

Scaffolding project in /Users/carlosazaustre/dev/vite-project...

Done. Now run:

  cd vite-project
  npm install
  npm run dev

Correr el proyecto.

Una vez creado, dirijete al directorio creado ejecuta el comando de instalación:

$ cd <nombre-de-mi-proyecto>
$ npm install

Una vez instaladas las dependencias, ejecuta el comando de desarrollo y ya puedes empezar a trabajar.

$ npm run dev

  vite v2.4.3 dev server running at:

  > Local: http://localhost:3001/
  > Network: use `--host` to expose

  ready in 590ms.