Search code examples
reactjseslintvisual-studio-codeprettier

Visual Studio Code Strange Formatting on save


When I select save on any file the VS CODE formatting my text with this {" "} anyone knows why?

       <Grid container justify="center">
          <Grid item>
            <Link
              href="/politicas"
              target="_blank"
              variant="body1"
              className="login-text login-conditions"
              color="textSecondary"
            >
              Recuerda: Al registrarte, aceptas los{" "}
              <b>Términos y Condiciones de Uso</b> y{" "}
              <b>Políticas de Habeas Data.</b>
            </Link>
          </Grid>
          {this.renderButton("Unirse")}
        </Grid>


Solution

  • This is likely happening because you're not meant to have trailing spaces at the end of your lines of code. So, VSCode will remove them. However, if you remove them then you would be losing information (a space / spaces) in your rendered JSX / HTML. So, to keep the space, VSCode adds " " which renders a space, and avoids the above trailing spaces issue.