Weird formatting when saving react project file in vscode

Question

I get an error after saving the file, the code automatically formats like the code below

error opening and closing tags, automatic carriage return, auto-add {" "} ).

Hope you can help.

Answer 1

Initially, I've struggled a lot with this as well. Follow these steps:

1. Press Ctrl + shift + P to open search fields.

2. Type settings.json. Don't press enter until the next step.

3. Select `Open Workspace Settings(JSON). This should open the workspace settings file in json format. It maybe empty for you.

Now paste this json inside the file.

{
    "files.associations": {
        "*.js": "javascriptreact"
    }
}

Save the file and the error should be gone for this particular project. But you have to do this for every React project. For an overall solution to this problem, you have to install a linter. Read more on that here.

I hope it helps!

Answer 2

Initially, I've struggled a lot with this as well. Follow these steps:

1. Press Ctrl + shift + P to open search fields in VS Code.

2. Type settings.json. Don't press enter until the next step.

3. Select `Open Workspace Settings(JSON). This should open the workspace settings file in json format. It maybe empty for you.

4. Now paste this json inside the file.

{
    "files.associations": {
        "*.js": "javascriptreact"
    }
}

5. save file