¿Sigues usando create-react-app para configurar tu proyecto React? Cambie a Vite para obtener un mejor rendimiento y una mayor velocidad de desarrollo.

Al iniciar un nuevo proyecto React, muchos desarrolladores recurren a crear-reaccionar-app como su herramienta de comando para la instalación y configuración de proyectos. Sin embargo, Vite es una mejor alternativa. Ofrece tiempos de desarrollo más rápidos y un mejor rendimiento.

¿Qué es Vite?

Vite es una herramienta de compilación y un servidor de desarrollo diseñado para mejorar el proceso de desarrollo de las aplicaciones web modernas. Lo hace dividiendo los módulos de su aplicación en dependencias y código fuente. Las dependencias son módulos que no cambian con frecuencia, mientras que el código fuente suele editarse con frecuencia durante el desarrollo.

usos de la vida esconstruir, un paquete basado en Go que es significativamente más rápido que los paquetes tradicionales basados ​​en JavaScript para acelerar el proceso de compilación del código fuente. También preempaqueta las dependencias de su aplicación y entrega el código fuente a través de ESM nativo, Permitir que los navegadores optimicen la carga de módulos para una aplicación más eficiente y rápida. actuación. Cuando llega el momento de implementar su aplicación en producción, Vite tiene un comando de compilación incorporado que optimiza automáticamente su aplicación para la implementación, lo que garantiza que su aplicación se ejecute sin problemas.

instagram viewer

Creación de un proyecto Vite

Antes de crear un proyecto de Vite, tenga en cuenta que Vite requiere la versión 14.18+ o 16+ de Node.js. Puede consultar estos artículos para instalar Node en su máquina Windows o Ubuntu.

  • Cómo instalar Node.js en Windows.
  • Aprender cómo instalar Npm y Node.js en Ubuntu

Cree un proyecto de Vite ejecutando este comando en la terminal.

npm crear vite@latest

Una vez que el comando comience a ejecutarse, se le pedirá un nombre de proyecto. Escriba el nombre de su proyecto y haga clic en entrar.

A continuación, Vite le pedirá que seleccione un marco. Selecciona Reaccionar.

Vite también le pedirá que seleccione una variante. Seleccione JavaScript.

Cuando Vite complete el scaffolding del proyecto, navegue por el directorio que crea e instale las dependencias a través de npm.

instalar npm

Para ejecutar el proyecto, use este comando:

npm ejecutar dev

Esta debería ser la página de inicio.

Puede comenzar a editar su proyecto y sus cambios se reflejarán en el navegador.

Use Vite para una velocidad de desarrollo rápida

CRA (create-react-app) suele ser la herramienta predeterminada para establecer la estructura y la configuración del proyecto para una aplicación React. Es conveniente ya que todo está configurado para usted, pero puede ser lento para compilar y recargar durante el desarrollo.

Vite, por otro lado, usa módulos ES nativos en el navegador para proporcionar tiempos de compilación más rápidos. Si no desea utilizar Vite, puede optar por un marco meta de React como Next.js, ya que también está diseñado para tener un alto rendimiento.