Datazo:
si usas el comando code -r .
No se abre una nueva pantalla, sino que utiliza la pantalla abierta.
Introducción
¿Qué es Vite?
Historia del Ecosistema de JavaScript
Características de Vite
Setup inicial
¿Cómo instalar Vite?
Boilerplate de Vite
Estilos CSS
Importar CSS
Pre-procesadores CSS
CSS Modules
Archivos estáticos
Importar imágenes
Importar JSON
Importación global
Configuración
Uso con TypeScript
Vite Config
Construir para producción
Variables de entorno y modos
Sitios multi-página
Construir librerías
Frameworks
Soporte para React
Soporte para Vue
Cierre del curso
Despedida
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
Soporte para React
17/19Recursos
Vite nos permite usar frameworks como por ejemplo react.js, vue.js y algunos otros como lit o svelte, a la vez que tenemos todas las ventajas de Vite. En este caso vamos a crear un proyecto con React y ver lo sencillo que es.
Creando un proyecto con React
Primero tendríamos que utilizar el comando npm create vite@latest o yarn create vite, el cual nos da una serie inputs que ya hemos visto anteriormente. A continuación te mostraré como lo configure yo:
? Project name: » vite-react? Select a framework: » react? Select a variant: » react
Es importante que si quieres crear un proyecto de React cuando te pregunten el framework escojas react.
Una vez acabes de dar los inputs verás que se generó un proyecto de React muy parecido con los que estamos acostumbrados a trabajar, solo faltaría instalar dependencias y con eso ya podrías ejecutarlo.
plugin-react
En los archivos que nos generó Vite destaca el vite.config.js, en el cual podemos encontrar un plugin para react que viene de @vitejs/plugin-react y lo estamos empleando en una configuración que se llama plugin, esta simple configuración es lo que nos permite trabajar con react.
Contribución creada por: Jofay Zhan Segura
Aportes 8
Preguntas 4
Ordenar por:
Esos cursos de React.js de JuanDc son la locura
Básicamente vite tiene soporte entero para React y Vue, estaría bueno que agregaran para Svelte también
En Vite.js también se puede configurar los auto-import para react mediante la siguiente configuración
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
/** @type {import('vite').UserConfig} */
export default defineConfig({
esbuild: { jsx: 'automatic' },
plugins: [react()]
})
Vite nos exige que donde usemos JSX siempre los archivos tienen que terminar en
.jsx
aqui seguimos! confiando en la ruta de platzi! excelente curso y profe! ❤️
En el contexto de Vite y JavaScript, SWC se refiere a “Super-fast Web Compiler” (Compilador web súper rápido, en español). SWC es un proyecto de código abierto que proporciona un compilador JavaScript/TypeScript extremadamente rápido y eficiente.
.
Vite es un marco de construcción de aplicaciones web y bundler (empaquetador) que utiliza tecnologías modernas como JavaScript modular (ES module) y carga rápida (Fast Refresh) para mejorar el rendimiento y la productividad del desarrollo web. Vite utiliza SWC como uno de sus compiladores para transformar el código JavaScript/TypeScript durante el proceso de construcción.
.
SWC está diseñado para ser un reemplazo rápido y eficiente del compilador Babel. Ofrece una velocidad de compilación significativamente más rápida, lo que resulta en un tiempo de construcción más rápido para las aplicaciones web desarrolladas con Vite.
.
En resumen, en el contexto de Vite y JavaScript, SWC se refiere a un compilador JavaScript/TypeScript súper rápido que se utiliza en el proceso de construcción de aplicaciones web con Vite para mejorar el rendimiento y acelerar el tiempo de construcción de la aplicación.
Este curso me está motivando a aprender react, ya que yo me he enfocado mas que todo en backend
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?