question-mark
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.

Prettier Stylelint integration not working.

See original GitHub issue

This is my current stylelint.config.js.

module.exports = {
  "extends": [
    'stylelint-config-idiomatic-order',
    './node_modules/prettier-stylelint/config.js',
    'stylelint-config-standard',
    'stylelint-config-recommended-scss'
  ],
  "ignoreFiles": '**/*.{vue, html, js}',
  "plugins": [
    'stylelint-scss'
  ],
};

I have the prettier.stylelintIntegration property set to true in my vscode settings, but despite this, in scss files it does not obey any of these extended rules. A good example is this; (How the file should look, minus the error of color not being in the correct order.) image

And now here is what happens upon formatting. (color not reordered, and removes all whitespace despite configs saying to leave it.) image

This leads me to believe the default VSCode formatter is being applied to scss rather than prettier, as this works perfectly in regular css files.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

3reactions
mrchiefcommented, Jun 26, 2018

For me, after upgrading to VS Code 1.24.1, formatting stops working (even for JS) after a while. There are no errors on terminal/console etc. Even right click > Format Document doesn’t do anything. The only way out is to restart Vs Code.

1reaction
JoshuaSoileaucommented, Oct 16, 2018

+1

Read more comments on GitHub >

github_iconTop Results From Across the Web

Integrating with Linters
First, we have plugins that let you run Prettier as if it was a linter rule: eslint-plugin-prettier. stylelint-prettier.
Read more >
How to integrate Prettier with ESLint and stylelint
Step 1. Install prettier-eslint, which is a tool that formats your JavaScript using Prettier followed by eslint --fix . The --fix is an...
Read more >
How to use VSCode Prettier 3 formatting with stylelint
Do you need Formatting option (Shift + Alt + F)?. No problem. You can define keybinding for option Fix all auto-fixable problems ....
Read more >
Getting started
If a shared config isn't available for your preferred language or library, then you can install the appropriate custom syntax yourself and use...
Read more >
stylelint-prettier - npm Package Health Analysis
The npm package stylelint-prettier was scanned for known vulnerabilities and missing license, and no issues were found. Thus the package was deemed as...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found