Snippets para React y JS (snipers-reaact)
Esta es una extensión de Visual Studio Code que proporciona una colección de snippets de código útiles para acelerar el desarrollo en JavaScript, TypeScript y HTML.
Características
Esta extensión te ayuda a escribir código repetitivo más rápido, desde simples console.log hasta estructuras completas de clases o páginas HTML.
Snippets Disponibles
A continuación se muestra una tabla con los snippets incluidos, sus prefijos y lo que hacen.
| Prefijo |
Descripción |
Lenguaje(s) |
clog |
Inserta un console.log con un marcador de posición. |
JS/TS |
fun |
Inserta una función básica con un return y un console.log. |
JS/TS |
suum |
Inserta un ejemplo de una suma entre dos variables. |
JS/TS |
class |
Define una clase estándar de ES6 con constructor y un método. |
JS/TS |
tsinterfaceclass |
Crea una interfaz y una clase que la implementa. |
TypeScript |
Pag |
Inserta un <!DOCTYPE html>. |
HTML |
htmlventas |
(Recomendado) Genera una estructura HTML completa para una página de tienda online, incluyendo CSS básico. Nota: El prefijo original Pag causa conflicto, se recomienda cambiarlo a htmlventas. |
HTML |
Uso
Para utilizar un snippet, simplemente comienza a escribir su prefijo en un archivo del lenguaje correspondiente (por ejemplo, .js, .ts, o .html) y presiona Enter o Tab cuando aparezca la sugerencia en IntelliSense.
!Demostración de uso de snippets
Instalación
Opción 1: Instalar desde archivo VSIX (Local)
- Empaqueta la extensión ejecutando
vsce package en la terminal. Esto creará un archivo .vsix.
- En VS Code, ve a la vista de Extensiones (Ctrl+Shift+X).
- Haz clic en el menú de los tres puntos (
...) y selecciona "Install from VSIX...".
- Elige el archivo
.vsix que generaste.
Opción 2: Marketplace (Próximamente)
Una vez publicada, podrás encontrarla buscando snipers-reaact en el Marketplace de extensiones de VS Code.
Este es un proyecto en desarrollo. ¡Cualquier sugerencia es bienvenida!
