¡Nx 16 está aquí!

May 03 2023

¡Nos enorgullece anunciar el lanzamiento de la versión 16 de Nx! En este artículo, repasaremos las principales actualizaciones de Nx 16 y la información clave que necesitará saber para los cambios que trae Nx 16. Pero antes de pasar a las nuevas funciones de Nx 16, recapitulemos algunas de las funciones recientes de nuestros lanzamientos menores de Nx 15. · Aquí se explica cómo actualizar con Nx Migrate · Rescoping from @nrwl/* to @nx/* · Deno Standalone Apps, Edge Deployment y más · Cypress Feature Testing · Task Graph · Nx Repo cambia a PNPM para su Package Manager · Más información Así es como se actualiza con Nx Migrate Al igual que con todas las nuevas versiones de Nx, nx migrate se puede usar para actualizar sus paquetes de Nx a la versión adecuada, así como para ejecutar los cambios necesarios en su base de código. Para actualizar a Nx 16, ejecute Si hay más migraciones disponibles, verá una migración.

Pero antes de pasar a las nuevas funciones de Nx 16, recapitulemos algunas de las funciones recientes de nuestros lanzamientos menores de Nx 15.

Introdujimos ajustes preestablecidos más simples para aplicaciones de inicio React, Angular y Node
Agregamos soporte oficial para Vite y Vitest para monorrepos Nx integrados
Introdujimos un complemento oficial de Deno , incluida la integración para la colocación de proyectos de Node y Deno y la compatibilidad con gráficos de proyectos para las importaciones de Deno.
Agregamos Rust al código base de Nx para acelerar la funcionalidad principal
Agregamos soporte para espacios de trabajo que no son npm para admitir espacios de trabajo centrados en otros lenguajes como C#, Java y Kotlin, y vimos algunos de ellos en acción con complementos comunitarios para .NET y Java/Kotlin.
Introdujo Nx Console para JetBrains IDE como IntelliJ y WebStorm
Hemos desacoplado la versión Nx de las versiones de Angular, lo que le permite actualizar Nx sin actualizar Angular

· He aquí cómo actualizar con Nx Migrate
· Rescoping from @nrwl/* to @nx/*
· Deno Standalone Apps, Edge Deployment y más
· Pruebas de características de Cypress
· Task Graph
· Nx Repo cambia a PNPM para su administrador de paquetes
· Más información

Así es como se actualiza con Nx Migrate

Al igual que con todas las nuevas versiones de Nx, nx migratese puede usar para actualizar sus paquetes de Nx a la versión adecuada, así como para ejecutar los cambios necesarios en su base de código.

Para actualizar a Nx 16, ejecute

nx migrate latest

Si hay más migraciones disponibles, verá un migrations.jsonarchivo en la raíz de su espacio de trabajo. Este archivo describirá cualquier otro script de generación de código que deba ejecutarse. Para ejecutarlos, use el comando ..

nx migrate --run-migrations

Una vez que se hayan ejecutado las migraciones, debería poder verlas en sus herramientas de control de código fuente. Asegúrese de que todo siga funcionando correctamente ejecutando cualquier prueba automatizada que haya configurado.

Mira este ejemplo del mundo real usando el nx migratecomando para el Tanstack/queryrepositorio:

También como un recordatorio para nuestros usuarios de Angular: ahora hemos desacoplado la versión Nx de las versiones Angular , por lo que siempre que tenga una versión LTS de Angular, puede migrar a la última versión Nx sin tener que tocar tu versión Angular! Para ello, asegúrese de utilizar la interactiveopción (por ejemplo nx migrate --interactive, ). Mira este video para más información:

Recuperación del alcance de @nrwl/* a @nx/*

Uno de los cambios más impactantes de Nx 16 es que cambiaremos el alcance de npm en el que publicamos nuestros paquetes de @nrwla @nx. En otras palabras, @nrwl/reactahora se publicará como @nx/react.

¡Nx manejará esta migración automáticamente a través del nx migratecomando para actualizar sus espacios de trabajo!

Para garantizar que los complementos de la comunidad no se rompan, las @nrwl/*versiones de estos paquetes están obsoletas, pero se seguirán publicando hasta Nx 17, que está programado para octubre de 2023.

¡ Y puede consultar los documentos para obtener más detalles si lo desea!

Aplicaciones independientes de Deno, implementación perimetral y más

Nx ha tenido soporte para desarrollar backends basados en Node por un tiempo. Fue una opción popular para construir su BFF en una configuración basada en monorepo junto con su aplicación React o Angular. En Nx 15.7, decidimos expandir ese soporte y realmente profundizar en la mejora del DX general.

Deno recibió bastante amor en esta iteración:

Compatibilidad con aplicaciones independientes: ahora puede montar un nuevo espacio de trabajo Deno de un solo proyecto con Nx. Solo npx create-nx-workspace --preset=@nx/denocorre Probablemente la forma más rápida de ponerse en marcha con Deno
También agregamos generadores Nx para configurar Deno con roble . Simplemente pase la --frameworkopción cuando configure una nueva aplicación Deno (o use Nx Console )

creó un paquete completamente nuevo @nx/netlify(actualmente en laboratorios ) que le permite configurar un proyecto completamente nuevo para desarrollar e impulsar las funciones de Netlify, o puede agregar soporte de implementación sin servidor a un proyecto existente, usando el generador @nx/netlify:setup-serverless. Echa un vistazo a nuestra receta detallada sobre el tema:https://nx.dev/recipes/deployment/node-serverless-functions-netlify
publicado nuevamente @nx/aws-lambdapara implementar funciones de Lambda en AWS. Todos los detalles en nuestra última receta:https://nx.dev/recipes/deployment/node-aws-lambda
Mejoramos nuestro paquete Deno existente para agregar compatibilidad con la implementación sin servidor tanto para Deno Deploy como para Netlify . Dicho soporte se puede agregar a una aplicación existente usando el @nx/deno:setup-serverlessgenerador y proporcionando el --platformindicador que apunta a deno-deployo netlify.

Nx configura pruebas e2e para aplicaciones que tienden a recopilar muchas funciones. Esto termina como una gran suite atómica que Nx no es bueno para separar. Con Nx 16, hemos facilitado la distribución de estas pruebas más cerca de la característica real que prueban. Esto hará que sea mucho más fácil nx affecteddeterminar qué pruebas son realmente necesarias.

También tuve la oportunidad de tener una transmisión en vivo con el propio Caleb de Nx (quien lideró la mayor parte del desarrollo de esta función), así como con Jordan Powell de Cypress, quien también contribuyó a este esfuerzo. Échale un vistazo:

Gráfico de tareas

Nx 16.0 también presenta herramientas más útiles para visualizar su proyecto y gráfico de tareas según lo determinado por Nx:

El gráfico de tareas en particular es útil para visualizar lo que realmente se ejecuta cuando ejecuta comandos, y con Nx 16.0, ahora puede usar la --graphopción cuando ejecuta la mayoría de los comandos Nx para visualizar el gráfico de tareas que se habrían ejecutado, por ejemplo:

nx build react --graph

Nx Repo cambia a PNPM para su administrador de paquetes

Internamente, el repositorio Nx cambió a usar pnpmcomo su administrador de paquetes. Desde el cambio, hemos notado las siguientes ventajas:

publicar es 2 veces más rápido
Tiempos de IC disminuidos
los tiempos de instalación disminuyeron

¡Terminando!

Eso es todo para Nx 16.0: nos encantó la oportunidad de traerles todas estas cosas geniales, y estamos ansiosos por comenzar nuestra próxima iteración con un enfoque constante en hacer de Nx una herramienta increíble para aumentar su productividad al tomar todo el tareas de administración de repositorios fuera de la ecuación para que pueda concentrarse en enviar cosas excelentes.