Estoy trabajando con ReactJs en VS Code. Me creé un proyecto nuevo y al modificar solo una palabra en el archivo App.js y luego guardar el archivo con el comando Command + s me distorsiona el código. Les pongo un ejemplo con mi código.
Este es mi código bueno, el código que por defecto react crea:
import React from 'react';
import logo from './logo.svg';
import './App.css';
function App() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Aprende React
</a>
</header>
</div>
);
}
export default App;
Ok, el código de arriba está ok, pero luego al presionar command + s, después de modificar la palabra "Aprende" por cualquier otra o modificando en cualquier otro lado del archivo me modifica todo el archivo y me lo deja así:
import React from 'react';
import logo from './logo.svg';
import './App.css';
function App() {
return ( <
div className = "App" >
<
header className = "App-header" >
<
img src = { logo }
className = "App-logo"
alt = "logo" / >
<
p >
Edit < code > src / App.js < /code> and save to reload. <
/p> <
a className = "App-link"
href = "https://reactjs.org"
target = "_blank"
rel = "noopener noreferrer" >
Aprende React <
/a> <
/header> <
/div>
);
}
export default App;
O sea, código feo, y aparte me tira errores.
Bueno, en realidad sí me hace los cambios (me lo refresca en la web los cambios), pero me lo formatea feamente, no se ve bonito el código, y los errores que veo son porque tengo el plugin Error Lens.
¿Alguien sabe por qué?
Por si acaso, comentar que esto sucede en todos los archivos del proyecto y esto no me pasaba cuando trabajaba con flutter.
Las extensiones instaladas que tengo son:
- Android IOS Emulator
- Awesome Flutter Snippets
- Bracket Pair Colorizer 2
- Cobalt2 Theme Official
- Dart
- Duplicate Selection or line
- Error Lens
- ESLint
- Flutter
- Format HTML in PHP
- GitLens — Git supercharged
- HTML Snippets
- Image preview
- JavaScript (ES6) code snippet
- JS-CSS-HTML Formatter
- Material Icon Theme
- One Dark Pro
- PHP Intellisense
- Polacode
- Pubspec Assist
- SQL Server (mssql)
- Version Lens