Webstorm not recognising JavaScript file

Intellij IdeaPycharmWebstormRubymineFile Type

Intellij Idea Problem Overview

Look

Webstorm doesn't recognize one of my .js files as a JavaScript file so I'm losing syntax highlighting and being able to add break points. I've looked in the workspace.xml file and the file in question seems to have similar settings to other .js files that work correctly.

If I change the name of the file it works ok. So somehow Webstorm is stuck on misinterpreting the type of a file that has this name. Where else can I edit the project?

Context menu

Intellij Idea Solutions

Solution 1 - Intellij Idea

So I see three possible reasons for the problem:

  1. The file was marked as 'Plain text'

  2. There is a pattern for 'Text files' file type that matches this file (or back: file type 'JavaScript' exclude this file name). See image below

enter image description here

  1. There is a custom plugin that overrides default behavior for files with this name (unlikely)

Updated: after several years I've found one more reason for the behavior and most likely it the main source of the issues. When you create a file without any extensions the "Register New File Type Association" is appeared. And you can accidentally specify a new file type, for some file name. It is can be fixed with (2) but it is the reason why the pattern was added there.

Register New File Type Association

Note: the solution works for all IDEA-based IDEs: IntelliJ IDEA, WebStorm, RubyMine, PyCharm, PhpStorm.

Solution 2 - Intellij Idea

File -> Settings -> Editor -> FileTypes -> Text files -> check for "ContentRepository.js" pattern there and remove it.

Solution 3 - Intellij Idea

If the file was marked as "Plain Text", then this can be fixed as follows:

  1. Right click on the file.

  2. One of the menu options is "Mark as Javascript" . Just below "Delete".

  3. Click that. Your file is now recognized as javascript by WebStorm.

Since WebStorm was not allowing screenshots after right click so couldn't add it here.

Solution 4 - Intellij Idea

My problem was with Auto-detect file type by context

enter image description here

Solution 5 - Intellij Idea

For me this did the trick

  1. Preferences
  2. Editor
  3. FileTypes
  4. Search for javascript
  5. Add *.js to registered patterns

Solution 6 - Intellij Idea

You can also try "Template data languages" (in file > settings) which will force a specific language synatax high-lighting on a specific file or folder. See screenshot belowenter image description here

For a block of code you can also use "language injection". Simply high-light the block of code, wait for the little lamp to appear then select the bottom choice and then the language you need (screenshot also attached)

enter image description here

Solution 7 - Intellij Idea

In case it is helpful elsewhere (OMG this was scary).

For some reason IntelliJ was not recognizing any .js file in my project (even after .idea removal (rm -rf .idea)).

I went to Webstorm (in my case RubyMine): Webstorm > Preferences ... > Editor > File Types then went to Recognized Filed Types, picked Javascript (but whatever file type you are missing will do), then added back a Registered Patterns entry of *.js

Of course, press Apply and then Ok.

Wow, scary stuff. but solved my problem, hope it does for someone else.

Solution 8 - Intellij Idea

I was always trying to add .js as a recognised file types, but somehow .js was added to Ignored Files and Folders.

I just removed .js from Ignored Files and Folders and it worked for me.

  1. Preferences
  2. Editor
  3. FileTypes
  4. Ignored Files and Folders
  5. Remove *.js

WebStorm -- Ignored Files and Folders

Solution 9 - Intellij Idea

enter image description here enter image description here

2022 update!

Right click on file and choose JavaScript

Categories
Recommended Intellij Idea Solutions
Recommended Pycharm Solutions
Recommended Webstorm Solutions
Recommended Rubymine Solutions
Recommended File Type Solutions

Previous Solution:

Does the order of members in a struct matter?

CStruct

Next Solution:

MomentJS - How to get last day of previous month from date?

JavascriptDateMomentjs

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionIan WarburtonView Question on Stackoverflow
Solution 1 - Intellij IdeaanstarovoytView Answer on Stackoverflow
Solution 2 - Intellij Ideauser2174102View Answer on Stackoverflow
Solution 3 - Intellij IdeashashiView Answer on Stackoverflow
Solution 4 - Intellij IdeaMathias Gheno AzzoliniView Answer on Stackoverflow
Solution 5 - Intellij IdeaYash SharmaView Answer on Stackoverflow
Solution 6 - Intellij IdeaRobert SinclairView Answer on Stackoverflow
Solution 7 - Intellij IdeakingPuppyView Answer on Stackoverflow
Solution 8 - Intellij IdeaSohrab HussainView Answer on Stackoverflow
Solution 9 - Intellij IdeaAlekseiView Answer on Stackoverflow