sass-lint in Visual Studio Code mixed tabs with spaces

Question

I just installed sass-lint in my VS Code editor and I keep on getting this error for each and every property(line) I've set in my *.scss files:

[sass-lint] Mixed tabs and spaces

Indentation type in VS Code is set to tabs(4), it is set to indent using Tabs.

How can I disable mixing of tabs and spaces for sass-lint?

Answer 1

To close this one off, I later on found out that it is a best practice to use a EditorConfig file to pre-set all of your workflow settings.

This is a plugin-type settings file, which pre-configures desired settings to fit your workflow.

In my case, I use EditorConfig for VScode. After you add it to your editor of choice, simply create a .editorconfig file in your base(root) directory and fill it with the desired settings.

e.g. , my base setup looks like this:

# Editor configuration, see http://editorconfig.org
root = true

[*]
charset = utf-8
indent_style = tab
indent_size = 4
insert_final_newline = true
trim_trailing_whitespace = true

[*.md]
max_line_length = off
trim_trailing_whitespace = false

Answer 2

The real reason is: SASS Lint isn't recognizing your indentation settings and it's using it default indentation (2 spaces). It's looking for 2 spaces and found tabs instead.

You can confirm it by removing all indentation and reading the hint.

As pointed on Pull#725, the correct syntax is:

indentation:
  - 1
  -
    size: 'tab'

Answer 3

I found that sass-lint in Sublime Text 3 wasn't loading my config file.

I got it working after reading this GitHub issue:

In SublimeLinter preferences (Preferences -> Package Settings -> SublimeLinter -> Settings):

"linters": {
    "sass": {
        "working_dir": "${/home/myusername}"
    }
},

Add the file .sasslintrc to your Home folder:

{
  "rules": {
    "indentation": [
      1,
      {
        "size": "tab"
      }
    ]
  }
}