Como desarrollo front-end, ¿qué complementos vale la pena instalar para vscode?
Debido a que VSCode no proporciona una interfaz integrada para abrir archivos directamente en el navegador, este complemento agrega al menú contextual la capacidad de ver archivos en el navegador predeterminado y en el cliente (La opción para abrir el panel de comandos en Firefox, Chrome, IE).
2. Quokka
Quokka es un complemento de herramienta de depuración que proporciona comentarios en tiempo real según el código que estás escribiendo. Fácil de configurar, puede obtener una vista previa de la función y los resultados del valor calculado de las variables. Además, funciona de forma inmediata en proyectos que utilizan JSX o TypeScript.
3. Faker
Utilice Faker, una popular biblioteca de JavaScript que le ayuda a insertar rápidamente datos de casos de uso. Faker puede generar aleatoriamente nombres, direcciones, imágenes, números de teléfono o chistes falsos aleatorios clásicos, y cada categoría también contiene varias subcategorías. Puede utilizar estos datos según sus necesidades.
4. CSS Peek
Con este complemento, puede realizar un seguimiento de las posiciones en su hoja de estilo definidas por clases e identificadores de CSS. Cuando hace clic derecho en un selector en un archivo HTML y selecciona la opción "Ir a definición y ver definición", le enviará el código CSS para el estilo.
5.Texto estándar HTML
Al utilizar el complemento de plantilla HTML, puede deshacerse del problema de reescribir las etiquetas de encabezado y cuerpo para nuevos archivos HTML. Sólo necesita ingresar html en un archivo vacío y presionar la tecla Tab para generar una estructura de documento limpia.
6. Más hermoso
La belleza es actualmente el formateador de código más popular en el desarrollo web. Después de instalar este complemento, puede aplicar automáticamente un formato más bonito y rápido a todos sus documentos JS y CSS en un estilo de código unificado. Si aún quieres usar ESLint, hay un complemento de Eslint más hermoso, ¡no te lo pierdas!
7. Información de color
Este práctico complemento le proporcionará información sobre los colores utilizados en CSS. Simplemente coloque el cursor sobre un color para obtener una vista previa de la información sobre el modelo de color (HEX, RGB, HSL y CMYK) en el bloque de color.
8.SVG Viewer
Este complemento agrega muchos programas SVG prácticos a Visual Studio Code. Puede abrir y ver archivos SVG sin salir del editor. Al mismo tiempo, también contiene opciones para convertir al formato PNG y generar patrones de URI de datos.
9. Resaltado de tareas pendientes
Este complemento puede marcar todos los comentarios TODO en el código para facilitar el seguimiento de cualquier trabajo sin terminar. De forma predeterminada, busca palabras clave TODO y FIXME. Por supuesto, también puedes agregar expresiones personalizadas.
10. Fuente de iconos
Este es un complemento que puede agregar fuentes de iconos a proyectos. El complemento admite más de 20 conjuntos de íconos populares, incluidos Font Awesome, Ionicons, Glyphicons y Material Design.
11. Hacer más pequeño
Esta es una aplicación para comprimir y fusionar archivos JavaScript y CSS. Ofrece toneladas de configuraciones de personalización, así como opciones para comprimir, guardar y exportar automáticamente a archivos .min. Puede funcionar con JavaScript, CSS y HTML a través de uglify-js, clean-css y html-minifier respectivamente.
12. Cambiar caso
Aunque VSCode tiene opciones de conversión de texto integradas y listas para usar, solo puede convertir texto entre mayúsculas y minúsculas. Este complemento agrega más formatos de nombres para modificar texto, incluidos nombres camelCase, nombres delimitados por guiones bajos, nombres Snake_case y nombres CONST_CAS.
13. Vista previa de expresiones regulares
Esta es una herramienta para probar expresiones regulares en tiempo real. Puede aplicar un patrón de expresión regular a cualquier archivo abierto y resaltar todas las coincidencias.
14. Paquetes de lenguaje y framework
De forma predeterminada, VSCode admite una gran cantidad de lenguajes de programación convencionales, pero si el lenguaje de programación que estás utilizando no está incluido, puedes descargar la expansión. Paquete agregado automáticamente. Al mismo tiempo, también puede agregar algunos paquetes de complementos de desarrollo web relacionados, como React Native y Vue.
15. Tema
Por supuesto, entre los muchos complementos prácticos, ¿cómo podemos perdernos un hermoso tema? Estás en "estrecho contacto" con tu editor VSCode todos los días. ¿Por qué no vestirse bien? Aquí hay algunos temas que lo ayudarán a cambiar la combinación de colores de sus barras de herramientas e íconos.
Un Monokai
Alya
Una Oscuridad
Icono Material