CODEWITHSUNDEEP
reactjsvisual-studio-code
Abhishek Ghadge
Abhishek Ghadge

Reputation: 435

VS code formatting breaks the code unexpectedly in .js files

I am a newbie in React. I am using vscode. Whenever I save app.js file, it formats the whole code and throws errors. screenshot

I tried reinstalling vscode. I am also not using any formatting extensions. Where is it getting wrong?

Upvotes: 0

Views: 1845

Answers (2)

Abdodt
Abdodt

Reputation: 138

As the other answer already mentioned, a prettier extension could solve the issue, but fundamentally this is because the VScode reads the program as js instead of Jsx. You can select the right language from the bottom panel as you can see from the image. So for the sake of it, I'll post how I do it as well.

enter image description here

Once you click that, a command pallet will open asking you to choose the language you want. Type react and choose the first option. This will clear the issues and read the program as JSX and all snippets if not working will function as well.

enter image description here

Upvotes: 3

Achal Jain
Achal Jain

Reputation: 379

Until you are comfortable with keyboard shortcuts refer following steps:

Go to File > Preferences > Settings > User > Text Editor > Formatting

Uncheck format on save option.

I would also recommend using prettier extension.

  • Install Prettier extensions
  • Open any file and Right click in the content area
  • Click Format document with and choose prettier

Upvotes: 1

Related Questions