How to associate a file extension with a certain language in VS Code

by

Update

Please note that JoelAZ’s answer 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:

// settings.json
// 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 User 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.

More Related Contents:

  1. Enable or disable VS Code Integrated Terminal Tabs?
  2. How do I hide certain files from the sidebar in Visual Studio Code?
  3. How to make VS Code treat a file extensions as a certain language?
  4. Open files always in a new tab
  5. Vertical rulers in Visual Studio Code
  6. Install a Nuget package in Visual Studio Code
  7. How can I navigate back to the last cursor position in Visual Studio Code?
  8. LaTeX fraction snippets in VSCode
  9. Switch focus between editor and integrated terminal
  10. How to add multiple terminals in VS Code?
  11. Create Custom Language in Visual Studio Code
  12. How to trigger documentation popup in vscode
  13. How do you determine which formatter is being used for VS Code?
  14. Why do I keep getting “[eslint] Delete `CR` [prettier/prettier]”?
  15. How to correctly set PYTHONPATH for Visual Studio Code
  16. How can I open Visual Studio Code’s ‘settings.json’ file?
  17. How can you disable Gutter Indicators in VS Code?
  18. Visual Studio Code. why are the window control buttons over the menu bar on the left side?
  19. Visual Studio Code’s recent update is disrupting autocompletion
  20. How do you change the formatting options in Visual Studio Code?
  21. How to add semicolon to the end of the line in visual studio code
  22. How do I set the default browser as chrome in Visual Studio Code?
  23. How can I commit some changes to a file, but not others, in VSCode?
  24. How do I turn on text wrapping by default in VS Code
  25. What is the migration procedure for moving from Windows system-wide Visual Studio Code to user setup?
  26. How to run a command in Visual Studio Code with launch.json
  27. Why does VS Code give a chip-like / distorted display when I hover over it with my mouse?
  28. VSCode hide top-right icons
  29. How to disable codelens in VS code?
  30. Completely uninstall VS Code extensions

Leave a Comment