Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Disabling eslint in styled components

See original GitHub issue

I’m trying to disable eslint so that doesn’t complain in vscode with prettier way of structuring code, but I can’t (testing all possible solutions with eslint-disable and also with prettier-ignore, no matter what I do I cannot get rid of the warning)

This is a GatsbyJS component that uses Styled Components

    "lerna": "^3.16.4",
    "babel-eslint": "^10.0",
    "eslint": "^6.2.1",
    "eslint-config-prettier": "^6.1.0",
    "eslint-config-standard": "^14.0.0",
    "eslint-plugin-import": "^2.16.0",
    "eslint-plugin-node": "^9.1.0",
    "eslint-plugin-prettier": "^3.0.1",
    "eslint-plugin-promise": "^4.1.1",
    "eslint-plugin-react": "^7.12.4",
    "eslint-plugin-standard": "^4.0.0",
    "gulp": "^4.0.0",
    "gulp-help": "^1.6.1",
    "prettier": "^1.16.4"

(with this one prettier eliminates the eslint-enable)

(with this one prettier also eliminates the eslint rule)

Issue Analytics

State:
Created 4 years ago
Comments:7 (3 by maintainers)

Top GitHub Comments

1reaction

kuworkingcommented, Sep 2, 2019

I confirm that this solve the issue, thanks a lot!

0reactions

kaicataldocommented, Aug 25, 2019

You’ll need to remove the following from your configured rules, as they’re overriding the configuration set by extending off of the Prettier plugin, resulting in the reported conflict:

"rules": {
    "indent": ["error", 2],
    "semi": ["error", "never"]
}

Prettier handles both white space and semi styling.

Top Results From Across the Web

How to disable stylelint for all non-string values - Stack Overflow

Is it possible to turn off stylelint linting in interpolations globally with the styled-components processor enabled? My eslint config ...

@layout-css/eslint-plugin-styled-components - npm

An ESLint plugin to validate styled-components do not modify component ... You can disable ESLint per instance, or globally for certain ...

Tooling - styled-components

The stylelint-config-styled-components will automatically disable rules that cause conflicts. Note. You can override rules defined in shared configs in your ...

Rules - ESLint - Pluggable JavaScript Linter

Disabling Rules. Using configuration comments. To disable rule warnings in a part of a file, use block comments in the following format:.

User Guide | eslint-plugin-vue-scoped-css

You can use /* eslint-disable */ -like CSS comments in <style> of .vue files to disable a certain rule temporarily. For example:.