Saltar al contenido

Autocompletado JSX o HTML en Visual Studio Code

Después de investigar con especialistas en esta materia, programadores de deferentes áreas y maestros hemos dado con la solución al dilema y la plasmamos en esta publicación.

Solución:

2019: Respuesta directa al grano para React

La forma más sencilla de obtener el autocompletado JSX/HTML en sus proyectos de React es agregar esto a la configuración de su usuario o a la configuración del espacio de trabajo (/.vscode/settings.json):

      "emmet.includeLanguages": 
        "javascript": "javascriptreact"
      ,
      "emmet.triggerExpansionOnTab": true

Es posible que deba reiniciar VS Code para que el cambio surta efecto.

PD: si no está haciendo este mapeo para un proyecto React.js, entonces la respuesta de KehkashanFazal probablemente debería funcionar para usted.

El código de Visual Studio detecta extensiones .jsx y agrega compatibilidad con emmet de forma predeterminada (estoy usando el código VS 1.8.1)

Pero si prefiere usar la extensión .js para todos sus archivos de reacción, puede asociar el modo JavaScript React con archivos .js en la esquina inferior derecha de la ventana de VS Code.

Cómo hacer esto paso a paso (gif)

ingrese la descripción de la imagen aquí

Si alguien todavía está luchando con este problema:

He descubierto que simplemente configurando

"emmet.syntaxProfiles": 
     "javascript": "jsx" 
 ,

no habilita la finalización de HTML. Pero, usando:

"emmet.includeLanguages": 
    "javascript": "html"

lo hace.

De acuerdo con los documentos de emmet:

"emmet.includeLanguages":

Habilite las abreviaturas emmet en idiomas que no se admiten de forma predeterminada. Agregue una asignación aquí entre el idioma y el idioma admitido por emmet.
P.ej: "vue-html": "html", "javascript": "javascriptreact"

Finalizando este artículo puedes encontrar los informes de otros desarrolladores, tú también eres capaz insertar el tuyo si dominas el tema.

¡Haz clic para puntuar esta entrada!
(Votos: 2 Promedio: 4)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *