[Bug]: Sorting properties not work about vscode-stylelint HOT 21 CLOSED

@StfBauer Thanks for the report with a reproducible repo. Some settings seem necessary. Can you try the below?

• Update .stylelintrc.js to include customSyntax in overrides. E.g.

  module.exports = {
    overrides: [
      {
        files: ["*.scss"],
        customSyntax: "postcss-scss",
        plugins: ["stylelint-scss"],
      },
    ],
  }

• Update .vscode/settings.json like this (see also the readme):

  {
  -    "css.validate": true,
  -    "less.validate": true,
  -    "scss.validate": true,
  +    "css.validate": false,
  +    "less.validate": false,
  +    "scss.validate": false,
  +    "stylelint.configFile": ".stylelintrc.js",
  +    "stylelint.validate": ["css", "scss"],
       "editor.codeActionsOnSave": {
         "source.fixAll.stylelint": "explicit"
       }
  }

from vscode-stylelint.

@ybiquitous I hate to be the bearer of bad news but nothing happened.

• Node 18
• Stylelint

{
  "dependencies": {
    "postcss-scss": "^4.0.9",
    "stylelint": "^16.2.1",
    "stylelint-order": "^6.0.4",
    "stylelint-scss": "^6.1.0"
  },
}

Well the settings under .vscode had no effect so I changed those in the global Settings json even though I have disabled it it was still active.

While on the other hand I only see on backend:

Not sure is it me or something else 😭

from vscode-stylelint.

@ybiquitous Sadly haven't changed anything :(

Update the repo. On the console I get

you should use the "customSyntax" option when linting something other than CSS

as a quasi error message.

from vscode-stylelint.

Thanks for updating the repo. When I tried StfBauer/temp-stylelint-debug@9ba2633, but it worked 👌🏼

diff --git a/hello-world.scss b/hello-world.scss
index bf87474..e678bc2 100644
--- a/hello-world.scss
+++ b/hello-world.scss
@@ -1,8 +1,22 @@
 @use "sass:meta";
 
 body {
+    position: absolute;
+
+
+    position: absolute;
+    z-index: 1000;
+    z-index: 1000;
+    top: 0;
+    top: 300px;
+    top: 0;
+    top: 300px;
+    right: 20px;
+    right: 20px;
+    bottom: 100px;
+    bottom: 100px;
    
-
+ 
     isolation: isolate;
 
     display: block;
@@ -19,26 +33,15 @@ body {
 
     margin: 300px !important;
 
+    font-family: "Courier New", Courier, monospace;
+    font-size: 20px;
+    font-weight: 300px;
+
 
     transition: all ease-in 1s;
 
     background-color: lime;
 
-    position: absolute;
-    z-index: 1000;
-    top: 0;
-    top: 300px;
-    right: 20px;
-    bottom: 100px;
-
-
-    position: absolute;
-    z-index: 1000;
-    top: 0;
-    top: 300px;
-    right: 20px;
-    bottom: 100px;
-
 
 
 
@@ -54,10 +57,6 @@ body {
         content: "Hello world";
     }
 
-    font-family: "Courier New", Courier, monospace;
-    font-size: 20px;
-    font-weight: 300px;
-
 }
 
 div {

[Info  - 2:01:20 AM] [language-server] Registering module | module: "auto-fix"
[Info  - 2:01:20 AM] [language-server] Module registered | module: "auto-fix"
[Info  - 2:01:20 AM] [language-server] Registering module | module: "code-action"
[Info  - 2:01:20 AM] [language-server] Module registered | module: "code-action"
[Info  - 2:01:20 AM] [language-server] Registering module | module: "completion"
[Info  - 2:01:20 AM] [language-server] Module registered | module: "completion"
[Info  - 2:01:20 AM] [language-server] Registering module | module: "formatter"
[Info  - 2:01:20 AM] [language-server] Module registered | module: "formatter"
[Info  - 2:01:20 AM] [language-server] Registering module | module: "old-stylelint-warning"
[Info  - 2:01:20 AM] [language-server] Module registered | module: "old-stylelint-warning"
[Info  - 2:01:20 AM] [language-server] Registering module | module: "validator"
[Info  - 2:01:20 AM] [language-server] Module registered | module: "validator"
[Info  - 2:01:20 AM] [language-server] Starting language server
[Info  - 2:01:20 AM] [language-server] Registering handlers
[Info  - 2:01:20 AM] [language-server] Handlers registered
[Info  - 2:01:20 AM] [language-server] Language server started

from vscode-stylelint.

Have I missed something in the general configuration? This is the behaviour I encounter.

from vscode-stylelint.

In my environment, you should use the "customSyntax" option when linting something other than CSS message is never shown in OUTPUT. 🤔

from vscode-stylelint.

Yeah I know - Pretty strange issue, I experimented a while before I raised the issue. Could it be an ARM vs Intel issue?

from vscode-stylelint.

When trying the lint in Terminal, do you get the following output?

$ npx stylelint '*.scss'

hello-world.scss
  6:5  ✖  Unexpected empty line before property "isolation"                          order/properties-order
 27:5  ✖  Expected "position" to come before "background-color" in group "position"  order/properties-order
 35:5  ✖  Expected "position" to come before "bottom" in group "position"            order/properties-order
 57:5  ✖  Expected "font-family" to come before "content" in group "typography"      order/properties-order

4 problems (4 errors, 0 warnings)

from vscode-stylelint.

Same as you.

from vscode-stylelint.

Hum, have you tried restarting Stylelint langserver or VSCode? If that didn't resolve the problem, I don't know why... 🤷🏼

from vscode-stylelint.

Restarted the service and then nothing will be reported at all.

from vscode-stylelint.

I tried it on a blank repo to, without the sorting rules or config. It works without any problem but not with that CSSComb like ordering of properties.

from vscode-stylelint.

@ybiquitous is there something I can do do enable advanced debugging. Something like verbose logging?

from vscode-stylelint.

Well, if you can check out this repository and try the dev version locally, you should see debug logs. Otherwise, there may not be a way to turn on debug logs for now... 🤔

from vscode-stylelint.

@ybiquitous Yeah I think I will do this. Tried to create a .env file in the extension folder but somehow it does not seem to reflect it in the dist build

from vscode-stylelint.

How about specifying env or envFile in .vscode/launch.json?

from vscode-stylelint.

I debugged now directly with the extension cause the other option haven't worked.

I mean It does not through any error but doesn't do anything at all.

The syntax warning I only get from this piece of code.

While I was debugging it further I got the following error:

FFW:

Which appears then a couple of times.

Any idea?

from vscode-stylelint.

Thanks for debugging. I have two questions:

• css.validate and scss.validate in .vscode/settings.json are true. Should these be false?
• Can you update Stylelint to v16?

from vscode-stylelint.

I think I have the same problem. Seemed like stylelint didn't pickup my .yaml config file. It turns out my setting.json in vs code had:

  "stylelint.config": {

  }

After deleting it stylelint was using my local .yaml config file correctly.

from vscode-stylelint.

Hey folks was looking into this for Griffel postcss syntax and found that there were some malformed headers in vscode.

I upgraded the language server dependencies to the latest major versions and it has fixed this issue for me - where stylelint seems like it's doing nothing. Once the vscode language server crashes it doesn't seem to recover correctly and needs a hard reload of vscode to recover ... until the malformed data error occurs again :-)

I've submitted PR #521 to fix

@StfBauer @ybiquitous

from vscode-stylelint.

@ling1726 - Thank you very much - hope this get merged and released soon as well as solve the problem. 🙏

from vscode-stylelint.