Novedades de WebStorm 2020.1

WebStorm 2020.1 incluye un diseño más pulido, compatibilidad con la API de Vue Composition y Vuex, la ejecución de Prettier al guardar y algunas mejoras para JavaScript y TypeScript.

Diseño

JetBrains Mono

Nueva fuente predeterminada para el editor

Durante el último año, hemos estado desarrollando una fuente que le permitiera escribir código de un modo más cómodo, sin fatigarle los ojos demasiado. ¡Le presentamos JetBrains Mono, un nuevo tipo de letra de código abierto hecho específicamente para escribir código! WebStorm 2020.1 se publica con este nuevo tipo de letra seleccionado de forma predeterminada.

Modo Zen para que se centre en el código

Escriba código sin distracciones

Hemos añadido un nuevo modo de visualización Zen para ayudarle a centrarse por completo en su código. Utilícelo siempre que quiera trabajar en un editor a pantalla completa con el código fuente centrado y los elementos de la interfaz de usuario ocultos para evitar distracciones.

Documentación rápida al pasar el ratón por encima

Vea la documentación al pasar el ratón por encima

Ya no necesita invocar explícitamente la ventana emergente Documentation. Ahora se mostrará cuando pase el ratón por encima de un símbolo, para que pueda encontrar la documentación relacionada más rápidamente. En caso de que haya algún problema con su código, la ventana emergente también ofrecerá un arreglo rápido que podrá aplicar para solucionarlo.

Utilización del IDE para modificaciones rápidas

¿Alguna vez le habría gustado usar el IDE para modificar rápidamente un archivo? Con el nuevo modo LightEdit, puede abrir un archivo individual en la ventana del editor de texto sin tener que cargar todo el proyecto.

Personalización de la barra de estado

Si no tiene la barra de estado oculta y la utiliza de vez en cuando, ahora puede decidir lo que quiere ver exactamente en ella. Haga clic con el botón derecho en la barra de estado y elimine los elementos que no necesite.

Marcos de trabajo

Finalización de código del API de Vue Composition

Trabajar con el API de Composition

Con WebStorm 2020.1 tendrá compatibilidad con los componentes definidos utilizando la API de Composition de Vue 3. En la sección de plantilla del componente, el IDE resolverá y autocompletará automáticamente los símbolos que devuelve la función setup() del componente, incluidas las propiedades del estado reactivo, las propiedades calculadas y las referencias.

Finalización de código Vuex

Asistencia a la codificación para Vuex

Si trabaja con la biblioteca Vuex, ahora obtendrá sugerencias para la finalización de símbolos de la tienda Vuex cuando edite componentes Vue. Además, WebStorm le permitirá saltar a la definición de captadores, mutaciones y acciones.

Compatibilidad total con Angular 9

Para ayudarle a trabajar con Ivy y otras funcionalidades de Angular 9, hemos añadido la compatibilidad total con ellas en WebStorm 2020.1. Puede utilizar funcionalidades como la finalización de código y las importaciones automáticas en TypeScript y los archivos de plantilla sin configuración.

Compatibilidad mejorada con React

Añada instrucciones de importación para los componentes definidos a través de React.memo colocando el signo de intercalación en un componente y pulsado Alt+Intro. Y si utiliza componentes de Material-UI en su proyecto, ahora verá sugerencias para la finalización cuando cree estilos.

Javascript y Typescript

Nuevas intenciones e inspecciones inteligentes

¡Utilice las nuevas intenciones e inspecciones inteligentes (Alt+Intro) para ahorrar tiempo al escribir código! Por ejemplo, puede convertir rápidamente el código existente en encadenamiento opcional y/o fusión nula, la sintaxis introducida en las versiones más recientes de JavaScript y TypeScript.

Documentación de TypeScript al pasar el ratón por encima

Documentación rápida más útil

Para JavaScript y TypeScript, la ventana emergente Documentation ahora muestra información más útil, incluidos detalles sobre el tipo y la visibilidad del símbolo, así como el lugar donde se define dicho símbolo.

Interfaz de usuario de la refactorización Introduce Field rediseñada

Gracias a la refactorización Introduce Field actualizada, puede ver una vista previa de los cambios en el contexto del código en el que está trabajando. Además, ahora necesita menos clics para aplicar la refactorización.

Compatibilidad con funcionalidades de TypeScript 3.8

WebStorm 2020.1 incluye TypeScript 3.8 integrado e introduce la compatibilidad total con nuevas funcionalidades TypeScript 3.8, como las importaciones/exportaciones solo de tipo, los campos privados y await de nivel superior.

Herramientas

Ejecutar Prettier al guardar

Ejecutar Prettier al guardar

Con la nueva opción Run on save for files, WebStorm aplicará el formato Prettier a todos los archivos especificados en la configuración del IDE y editados en el proyecto en cuanto guarde dichos archivos. Los monitores de archivos o complementos de terceros ya no son necesarios para esto.

Sesiones de terminal divididas

Visualización de las sesiones de terminal en paralelo

Para que sea más sencillo trabajar con el emulador de terminal integrado, WebStorm ahora le permite dividir las sesiones de terminal vertical y horizontalmente. Controle la salida de varias herramientas que están en uso actualmente sin cambiar entre pestañas.

Corrector ortográfico integrado

Corrector ortográfico integrado

A partir de la versión 2020.1, WebStorm vendrá integrado con Grazie, nuestra herramienta inteligente para la corrección ortográfica, gramatical y de estilo. Esto le ayudará a evitar errores gramaticales al añadir comentarios, mensajes de confirmación y construcciones de lenguaje JavaScript.

Comparta configuraciones de ejecución de manera más flexible

¿Tiene compañeros que necesitan trabajar con su proyecto? Comparta su configuración de ejecución con ellos. WebStorm 2020.1 le ofrece incluso más libertad al respecto ya que ahora puede almacenar sus configuración de ejecución en cualquier carpeta de proyecto de su elección.

Utilización de Yarn 2 en proyectos TypeScript

Hemos ampliado la compatibilidad inicial con Yarn 2, que se introdujo en WebStorm 2019.3. Ahora todos los símbolos se resuelven y se completan automáticamente de manera adecuada en los proyectos TypeScript cuando las dependencias se instalan mediante Yarn 2 con el modo Plug’n’Play.

Control de versiones

Rediseño del cuadro de diálogo para el rebasing de confirmaciones

Rediseño del cuadro de diálogo para el rebasing de confirmaciones

¿Quiere que su historial de confirmaciones sea más lineal y exhaustivo? Ahora se ha vuelto algo mucho más sencillo gracias al cuadro de diálogo actualizado y más interactivo de Rebasing Commits. Muestra las acciones que se pueden aplicar a cada confirmación y le permite revisar los detalles y el diff de la confirmación, así como restablecer rápidamente los cambios aplicados.

Ventana de herramientas Commit

Modificaciones en el flujo de confirmación

Para mejorar el flujo de las confirmaciones, hemos desarrollado una nueva ventana de herramientas Commit para gestionar todas las tareas relacionadas con las confirmaciones. Se han habilitado las nuevas instalaciones de forma predeterminada. Si es un usuario existente, verá un aviso en el cuadro de diálogo Commit con el que podrá cambiar rápidamente a la nueva interfaz de usuario.