react-jsx - visual - vscode auto close tags jsx

Cambiar idioma a JSX en Visual Studio Code

Question

Visual Studio Code ahora admite JSX en la versión 0.8 , pero parece que la única forma de activarlo es con una extensión de archivo .jsx . No está en la lista para cambiar el modo de idioma manualmente, la opción más cercana es JavaScriptReact , pero no analiza las etiquetas JSX.

Estoy en un proyecto con muchos archivos .js con JSX y no puedo cambiarlo.

¿Hay alguna otra forma de usar la sintaxis JSX sin la extensión .jsx ?

Answer 1

Ahora hay una extensión de código VS que permite que los archivos .js se traten como archivos .jsx .

Lamentablemente, el archivo Léame de la extensión también advierte:

cuando instale esta extensión, perderá todo el soporte de idioma existente proporcionado para archivos .js

Afortunadamente, VS Code ahora está muy cerca de adoptar Salsa , lo que significa que pronto el problema js-is-jsx debería resolverse por completo.

Answer 2

Aunque la respuesta de Dionys funciona, hay una mejor manera de hacerlo en versiones más recientes de Visual Studio Code.

Vaya a File>Prefrences>Settings y luego desplácese hacia abajo y busque "Emmet" abra la pestaña y debería ver el siguiente texto

  // Enable Emmet abbreviations in languages that are not supported by default. Add a 
  mapping here between the language and emmet supported language.
  //  E.g.: {"vue-html": "html", "javascript": "javascriptreact"}
  "emmet.includeLanguages": {},

Tan solo siga las instrucciones y agregue "emmet.includeLanguages": { "javascript": "javascriptreact" } en el json en el panel derecho (que sobrescribirá la configuración del usuario).

Answer 3

Cambie la configuración del usuario o la configuración del espacio de trabajo de la siguiente manera:

// Place your settings in this file to overwrite the default settings
{
    "files.associations": {
        "*.js": "javascriptreact"
    }
}

Nota: es posible que deba reiniciar VSCode.

Answer 4

Creo que la siguiente es la forma más fácil de formatear el código

Haga clic en la parte inferior derecha en VS Code Editor donde dice Javascript.

Verá una opción para seleccionar el modo de idioma, aquí puede buscar JavaScriptReact y seleccionar. Eso es. Esto debería solucionar tu problema.

1)

Answer 5

Intente usar el enlace en Mac o Linux.

ln -s index.ios.js index.ios.jsx

Answer 6

Me tomó un tiempo resolver esto, pero JSX ya es parte de Emmet, que es parte de VS Code. Le dije a Emmet que también (adicionalmente) ponga fragmentos JSX disponibles en archivos JS normales.

Simplemente ponga esto en su archivo de configuración:

"emmet.syntaxProfiles": {
    "javascript": "jsx"
}    

Answer 7

Podría hacerlo, pero "no reaccionar archivos JS" también se muestran con el modo JavaScriptReact.

1. abra el archivo C: / Archivos de programa (x86) / Microsoft VS Code / resources / app / plugins / vs.language.javascript / syntaxes / javascriptreact.json (probablemente, debe abrirse con privilegios de administrador).
2. cambie "jsx" a "js" en la matriz "fileTypes".
3. reinicie la aplicación, cierre los archivos js abiertos y vuelva a abrir.

Answer 8

Simplemente instale una extensión:

• Presione F1 (en Visual Studio Code)
• Escriba "extensión" en el campo de texto que aparece
• Elija "Extensiones: Instalar extensión"
• Escriba "ext install jsx"
• Reiniciar el código de Visual Studio

Fuente:

https://code.visualstudio.com/docs/editor/extension-gallery?pub=TwentyChung&ext=jsx https://marketplace.visualstudio.com/items/TwentyChung.jsx