vscode settings - How to make VS Code treat a file extensions as a certain language?

Question

Or is there a way to switch the current file's language so that the syntax is highlighted correctly?

For example, *.jsx is actually JavaScript but VS Code doesn't recognize it.

Answer 1

Update

Please note that JoelAZ's answer here is much easier and results in the same setting changes! The answer below is still valid, just more steps & more fuss.

Old answer

In Visual Studio Code, you can add persistent file associations for language highlighting to your settings.json file like this:

// Place your settings in this file to overwrite the default settings
{
  "some_setting": custom_value,
  ...

  "files.associations": {
    "*.thor": "ruby",
    "*.jsx": "javascript",
    "Jenkinsfile*": "groovy"
  }
}

You can use Ctrl+Shift+P (or View -> Command Palette from the menu) and then type settings JSON. Choose Preferences: Open Settings (JSON) to open your settings.json.

To find the proper language ID, use Ctrl+Shift+P (or View -> Command Palette from the menu) and then type Change Language Mode. You can see the language ID in the list, e.g. type docker to find the language ID for Docker files (dockerfile). In the first entry in the example above, .thor is the file ending, ruby is the language ID.

The Files: Associations feature was first introduced in Visual Studio Code version 1.0 (March 2016). Check the available wildcard patterns in the release notes and the known language strings in the documentation.