Novedades de WebStorm 2022.1
Mejor compatibilidad con Next.js, integración con Volta, mejoras para Docker, compatibilidad con ESM para la configuración de webpack, la posibilidad de ejecutar comandos desde archivos Markdown y más.
Marcos de trabajo y tecnologías
Mejor compatibilidad con Next.js
Gracias a la compatibilidad con React incorporada en WebStorm, todas las funcionalidades clave ya deberían estar funcionando en sus proyectos Next.js. WebStorm 2022.1 añade compatibilidad con algunos aspectos específicos del marco de trabajo, como las páginas. El IDE resolverá las rutas utilizadas en el atributo href de sus componentes de enlace, así como en form y otras etiquetas. La finalización de código, la navegación y las refactorizaciones también funcionarán.
Compatibilidad con Volta
In this release, we’ve added proper integration with Volta, a JavaScript tool manager. WebStorm reconocerá automáticamente Yarn y npm instalados con Volta.
Correcciones para Vue
WebStorm 2022.1 incorpora varias mejoras para Vue 3. Si define los componentes globalmente, el IDE los reconocerá ahora en sus archivos .vue. WebStorm también debería se compatible con la sintaxis de createApp. Se adaptará correctamente a las aplicaciones creadas mediante createApp con sus elementos relacionados. Asimismo, se ha añadido compatibilidad con Nuxt 3.
Mejoras para Docker
Hemos rediseñado la interfaz de usuario de Docker en la ventana de herramientas Services. Las novedades se han implementado para contenedores, imágenes, redes y volúmenes. También hemos añadido compatibilidad con la API Docker Registry HTTP V2 para utilizarla con Docker 1.6+. Puede crear registros Docker V2 simples o protegidos por contraseña y realizar acciones como ver, hacer push y hacer pull de imágenes.
Compatibilidad con Corepack
WebStorm now supports Corepack, an experimental Node.js tool that lets you use Yarn and pnpm without having to install them.
Compatibilidad con ESM para la configuración de webpack
A partir de la versión 2022.1, la asistencia de codificación de webpack funcionará con los módulos ES en sus archivos webpack.config.js.
Editor
Ejecutar comandos desde archivos Markdown
Si le gustan los pequeños detalles de WebStorm, seguro que le gustará esta incorporación. Los archivos README suelen describir los pasos necesarios para ejecutar una aplicación, y enumeran un sinfín de comandos que utilizar. WebStorm 2022.1 le permitirá ejecutar esos comandos directamente desde el archivo README. Solo tiene que hacer clic en el icono de ejecutar situado a la izquierda del comando.
Actualización de la barra de herramientas flotante del editor Markdown
Para facilitar el formateo de los archivos .md, hemos modificado la barra de herramientas flotante que aparece al seleccionar el texto. Además del nuevo diseño, la barra de herramientas ahora ofrece la función de creación de listas y un menú desplegable que permite seleccionar los estilos de encabezado.
Copiar fragmento de código para Markdown
También hemos añadido la nueva acción Copy code snippet a los bloques Markdown. Esto le permitirá copiar rápidamente su contenido en el portapapeles.
Compatibilidad con el modo de ejecución sin repeticiones en el formateador de la línea de comandos
El formateador de línea de comandos ahora es compatible con el modo de ejecución sin repeticiones para validar los archivos de proyecto. Si un archivo necesita ser formateado, saldrá con un estado distinto de cero.
Reformateo de código en modo LightEdit
Ahora puede reformatear su código desde el modo LightEdit. Para ello, vaya a Code | Reformat Code en el menú principal o pulse Ctrl+Alt+L.
Javascript y Typescript
Vista Structure mejorada
Con la vista Structure, puede examinar sus archivos y saltar a partes específicas de estos más rápidamente. En esta versión, hemos simplificado el examen de los archivos JavaScript y TypeScript. Los símbolos de un archivo se presentan ahora en un orden más lógico. Además, ahora WebStorm mostrará iconos de exportación junto a los símbolos exportados para que sean más fáciles de distinguir.
Nuevos casos cubiertos por la acción Join Lines
¿Sabía que WebStorm le permite unir líneas o bloques de código utilizando Ctrl+Mayús+J? Esta acción funciona ahora para las declaraciones if anidadas. WebStorm también eliminará los corchetes redundantes cuando utilice la acción Join Lines en las declaraciones if, while, for-of y otras similares con bloques de una sola línea.
Colores de resaltado configurables para enums
Hemos incorporado nuevas opciones de resaltado de sintaxis de Enum y Enum member. Las encontrará en Preferences / Settings | Editor | Color Scheme | TypeScript. Sus valores por defecto se heredan de Class para Enum y de Static member variables para Enum members.
Experiencia de usuario
Nueva ventana de herramientas Notifications
Hemos sustituido el Event Log de WebStorm por una nueva ventana de herramientas Notifications. Esperamos que le ayude a mantener una mejor visión general de las notificaciones del IDE para que no se pierda nada importante.
Mejoras en la interfaz de usuario del depurador
Para maximizar el espacio utilizable en la ventana de herramientas del depurador, hemos ocultado las etiquetas de las pestañas de forma predeterminada. Para que vuelvan a ser visibles o para personalizar su ubicación, utilice la opción Show Tab Labels en Layout Settings.
Cuadro de diálogo Structural Search and Replace actualizado
El cuadro de diálogo Structural Search and Replace presenta ahora una lista de todas las plantillas para facilitar la navegación entre ellas. También hemos añadido un icono Pin Dialog en la esquina superior derecha del cuadro de diálogo y hemos movido las casillas de verificación de Injected code y Match case a la parte inferior del panel Search template.
Mejoras de accesibilidad
Para facilitar la navegación por la pestaña Log, el lector de pantalla ahora lee los nombres y descripciones de los árboles de las ramas. Además, se ha mejorado la compatibilidad con la accesibilidad en macOS. Hemos corregido la posición incorrecta del cursor de VoiceOver cuando se trabaja en un monitor externo. Ahora VoiceOver también puede leer listas de cuadros combinados.
Posibilidad de dividir el editor en partes iguales
Hemos implementado un pequeño toque especial para aquellos a quienes les gusta reorganizar su espacio de trabajo dividiendo el editor. Ahora puede configurar las pestañas divididas para que tengan la misma anchura. Para ello, vaya a Preferences / Settings | Advanced Settings y seleccione la nueva opción Equalize proportions in nested splits.
Control de versiones
Actualización de Annotate with Git Blame
Hemos mejorado la funcionalidad Annotate with Git Blame para que sea más fácil investigar los cambios introducidos. El IDE resalta las diferencias en las líneas directamente en el editor al pasar el ratón por encima de una anotación, y abre la pestaña Log en la ventana de herramientas Git al hacer clic en ella.
Panel Commit Details en la ventana de herramientas Git actualizado
El panel de Commit Details ahora incluye información sobre las firmas GPG y el estado de la compilación. Anteriormente, estos datos se mostraban solo como una columna en el registro Git.
Cambios sugeridos en los comentarios de solicitud de incorporación de cambios
Ahora es más fácil trabajar con los cambios sugeridos en WebStorm. Hemos añadido la posibilidad de aplicar o confirmar cambios localmente directamente desde el IDE.