My Visual Studio Code extension is not showing code properly

Question

Hello guys I am a student and a learner, new to Visual Studio code. I was working with java Scr ipt and whenever I was trying to save my code by pressing Ctrl+save button it was automatically indenting my code which show problems in my terminal can you please help me out: Here is what i wrote before pressing Ctrl+save:

  return ( <
        div className = "App" >
        <h1> Hello World this is my world i am the master of this world you all are my slaves! </h1>
        <FormControl >
        <InputLabel > Email a message... </InputLabel> 
        <Input value = { input }
        onChange = { event => setInput(event.target.value) }/>
        <Button disabled = {!input }
        color = "primary"
        variant = "contained"
        onClick = { sendMessage } > send </Button>  
        </FormControl>

{
  message.map(message => ( 
    <Message text={message}/>
  ))
} 
</div>);
  }  

     

And here what it automatically does after pressing Ctrl+S:

    return ( <
    div className = "App" >
    <
    h1 > Hello World this is my world i am the master of this world you all are my slaves! < /h1> <
    FormControl >
    <
    InputLabel > Email a message... < /InputLabel>  <
    Input value = { input }
    onChange = { event => setInput(event.target.value) }
    /> <
    Button disabled = {!input }
    color = "primary"
    variant = "contained"
    onClick = { sendMessage } > send < /Button>   <
    /FormControl>

    {
        message.map(message => ( <
            Message text = { message }
            />
        ))
    } <
    /div>);
}

Because this i am getting problems in my terminal as:

{
"resource": "/c:/Users/DELL/Desktop/fbmsg/fbmsg/src/App.js",
"owner": "typescript",
"code": "1005",
"severity": 8,
"message": "'</' expected.",
"source": "ts",
"startLineNumber": 41,
"startColumn": 24,
"endLineNumber": 41,
"endColumn": 24

}

Answer 1

I'm assuming that you'd like to know how to save your work in VS Code without the automatic formatting. If that's the case, there's a keyboard shortcut that saves the file without formatting.

For Mac : Shift+KS

You can also open your command pallet with Shift+Cmd+P and search there for "Save without formatting" and it should tell you the correct shortcut.

Answer 2

You can install Prettier extension from the extension market of VS-Code. It makes code neat and pretty.

• You can further read about it here
• Other day to day VS-Code extensions can be found here