Migrar tu aplicación Vue 2 a Vue 3 no tiene por qué ser doloroso. Esta masterclass te guiará a través del proceso.
Migrando a Vue 3
Video Summary and Transcription
Esta masterclass se centra en el proceso de migración de aplicaciones generadas por Vue CLI a Vue 3. Proporciona instrucciones paso a paso sobre cómo eliminar Vue 2, solucionar errores y advertencias, y desinstalar la versión de migración. La masterclass también menciona una hoja de trucos de Vue 2 a Vue 3 disponible como guía completa. Además, la masterclass presenta una versión especial de migración a Vue 3 para ejecutar aplicaciones existentes en el modo de vista dos, proporcionando advertencias y un entorno seguro para las actualizaciones de código.
1. Introducción a React y la migración
Bienvenidos de nuevo a la charla sobre el trabajo con APIs reescritas para React. Hemos creado una versión especial de migración a la vista tres que permite ejecutar aplicaciones existentes en el modo vista dos. Proporciona advertencias sobre características obsoletas y un entorno seguro para las actualizaciones de código. Utilizaremos una aplicación de muestra para demostrar el proceso de migración. Vamos a instalarla.
Entonces, bienvenidos de nuevo. Y bienvenidos de nuevo a la charla, ¿cómo se llama? ¿Qué aplicaciones se pueden ejecutar en React? No se puede ejecutar un tiempo de ejecución en React. Y hoy estamos aquí para hablar sobre el trabajo con APIs que han sido reescritas para que tus aplicaciones web se ajusten y para tu experiencia de programación.
Y antes de empezar, echemos un vistazo a algunas de las características que hemos creado y puesto a tu disposición dentro de React. Así que aquí tienes algunas de las características que hemos creado en nuestra demostración. La primera es esencialmente la versión de migración a la vista tres. Es una versión especial de la vista tres que te permite ejecutar tu aplicación existente en el modo vista dos. Te proporciona advertencias útiles sobre características obsoletas y ofrece un entorno seguro para actualizar tu código de forma incremental.
Para practicar y ver cómo se utiliza la versión de migración, vamos a utilizar una sencilla aplicación de muestra. Puedes acceder al repositorio clonando este enlace aquí, y veremos cómo realizamos esos cambios para actualizarlo a la vista tres con la ayuda de la versión de migración.
Antes de empezar, echemos un vistazo a esa aplicación de muestra en el navegador. Como puedes ver, es muy sencilla. Solo tienes que pulsar ese botón de `pop` y se quitará el número de la parte inferior de la lista. Para hacer este proceso de migración más realista, hemos añadido algunas características obsoletas a esta aplicación de demostración, que tendremos que actualizar para que sea compatible con la vista tres. Ahora que hemos visto la aplicación que vamos a actualizar, ¿cuál es el proceso de cuatro pasos? La instalas, corriges los errores, corriges las advertencias y luego la desinstalas.
2. Actualización de una aplicación generada por Vue CLI a Vue 3
Para actualizar una aplicación generada por Vue CLI a Vue 3, ejecuta VueUpgrade en la terminal. Elimina Vue 2 y el compilador de plantillas de Vue, instala las dependencias y crea un archivo vue.config. Corrige los errores eliminando el atributo funcional y las props. Soluciona las advertencias importando create app y agregando la opción deep. Desinstala la versión de migración y elimina el archivo de configuración. Descarga la hoja de trucos de Vue 2 a Vue 3 en vmastery.com para obtener una guía completa.