Tabs and Indents are 2 spaces despite setting at 4 spaces

I have Code Style -> Javascript -> Tabs and Indents set to the following.

Tab size: 4
Indent: 4
Continuation indent: 4

I am using WebStorm 9 on Ubuntu 14.4. Tabs come out at 2 spaces when I hit TAB or Enter, not 4 spaces. I cannot find anywhere in the Settings where the tab and indent are set to 2 spaces. I cannot control this. Does anyone have any idea why this is happening?

12 comments
Comment actions Permalink

Hi there,

1) "Settings | Editor | Code Style" -- try disabling "Detect and use existing file indents for editing" in case if you have it enabled (it is by default). NOTE: re-opening file in editor may be required.

2) Do you have any .editorconfig files anywhere in the path of that file? Settings from .editorconfig have priority over (will overwrite) your IDE settings.

63
Comment actions Permalink

Thanks, .editorconfig was the reason :)

16
Comment actions Permalink

Recommendation for an enhancement to IntelliJ

If a user (me) changes the tab settings when an .editorconfig file exists, please tell me that my changes may not be used in the current project because a file (.editorconfig) will override the IDE settings.

I changed every language setting, and was about to post a question titled

Javascript indent change from 2 spaces to 4

when I found this post.

4
Comment actions Permalink

@PatS2265

It's there: "Settings/Preferences | Editor | Code Style"

 

2
Comment actions Permalink

If all solutions aboved you try is not working, try restart IDE.

0
Comment actions Permalink

I somewhat agree with @PatS2265. I know the warning exists in the settings, but because that option is on by default, I never actually saw the warning.

 

On the flip side, that's probably a decent amount of work just to stop bafoons like us from letting our own settings override ourselves 🙃

0
Comment actions Permalink

I gave up on the ( TAB ) indent for right indent on IntelliJ with Vim plugin; my fallback is to mouse select multiple lines and indent them to the right with a ( SHIFT + > ) combination.   This works for IntelliJ 2019.2 on a Mac.

0
Comment actions Permalink

For me, the problem was that PhpStorm was incorrectly detecting my mixed PHP/HTML file as a Vue file, and was applying the default Vue code styles instead of the expected PHP and HTML rules. I got around this by changing the Vue code styles to match my PHP/HTML indent settings, but I couldn't figure out how to force PhpStorm to stop detecting my regular PHP/HTML files as Vue.

0
Comment actions Permalink

@Cmmcneil

1. Why do you think such file is treated as Vue one (ignoring the code style thing) -- any visual indicators (like file icon etc)?

2. Do you actually use Vue in this project? If not -- other projects?

0
Comment actions Permalink

Andriy Bazanov

After further testing: the indentation for the PHP sections of the code used the PHP code styles as expected. It is only the HTML sections of the file that are using Vue rules instead of HTML rules.

I'm not sure why the HTML in the files in question is being treated as Vue, when there's no <template> tags and no .vue file extension or any visual indicators. The file extension is .php, the file icon is the regular php one. I am using Vue in another part of this project, but only as a plugin and not as a complete framework (no .vue files).

When I go to "Code > Configure Current File Analysis..." it shows PHP and Vue as the two languages, but if I click "Configure Inspections..." in this menu, the menu closes and nothing happens:

0
Comment actions Permalink

@Cmmcneil

AFAIK this behavior is activated by Vue-related entry in your package.json. If you do not actually use Vue, consider disabling the plugin then (surprisingly it messes up a bit of things in PHP files, sometimes in in unexpected places, like https://youtrack.jetbrains.com/issue/WEB-43037)

Anyway, accordingly to https://youtrack.jetbrains.com/issue/WEB-47948 this is fixed for next minor 2020.3.1 version, Preview/EAP build of which has been published earlier today: https://blog.jetbrains.com/phpstorm/2020/12/phpstorm-2020-3-1-preview/ -- give it a try.

2
Comment actions Permalink

Thank you very much Andriy. Sharing a project with a coworker using VS code, .editorconfig was the issue. That's now clean code in front of me, love it.

0

Please sign in to leave a comment.