How can I get Prettier to Let Me Use Tabs

Question

I'm using ESLint and Prettier with the AirBNB style guide.

For the life of me I can't get it to stop yelling at me on every single line of my file to use spaces.

.eslintrc.json

{
    "env": {
        "browser": true,
        "es2021": true
    },
    "extends": ["airbnb-base", "prettier", "plugin:node/recommended"],
    "parserOptions": {
        "ecmaVersion": 12,
        "sourceType": "module"
    },
    "plugins": ["prettier"],
    "rules": {
        "prettier/prettier": "error",
        "indent": ["warn", "tab"],
        "quotes": ["warn", "single"],
        "no-unused-vars": "warn",
        "no-console": "off",
        "no-tabs": "off",
        "no-restricted-syntax": "off",
        "func-names": "off"
    }
}

package.json dependencies

"devDependencies": {
        "autoprefixer": "^10.1.0",
        "clean-css-cli": "^4.3.0",
        "concurrently": "^5.3.0",
        "cross-env": "^7.0.3",
        "eslint-config-airbnb-base": "^14.2.1",
        "eslint-plugin-import": "^2.23.4",
        "live-server": "^1.2.1",
        "postcss-cli": "^8.3.1",
        "postcss-import": "^14.0.2",
        "pwa-asset-generator": "^4.1.1",
        "tailwindcss": "^2.0.2"
    }

settings.json

{
    "editor.linkedEditing": true,
    "editor.detectIndentation": true,
    "notebook.cellToolbarLocation": {
        "default": "right",
        "jupyter-notebook": "left"
    },
    "prettier.tabWidth": 4,
    "prettier.useTabs": true,
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "eslint.alwaysShowStatus": true,
    "workbench.colorTheme": "Default Dark+",
    "prettier.singleQuote": true,
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true
}

I have tabs set everywhere. This exact setup worked before (I had to factory reset my machine). I have my VS code settings synced, and the eslintrc and pacakge.json files should be the exact same as before...

I've also tried ` "editor.tabSize": 4` and I don't have a .prettierrc or .editorconfig. I've tried removing prettier from my .eslintrc.json as well. Have no idea why nothing is working. I should clarify that it's indenting with tabs, but highlighting them red in error. — Justin

Justin Justin · Accepted Answer · 2021-07-26T09:44:31

0

votes

Restarting VS code a second time worked...

How can I get Prettier to Let Me Use Tabs

1 Answers