After getting the latest update, I have errors in my LESS files

[MrVladevoit]

What version of stylelint, prettier and stylelint-prettier are you using?

I'm using:

"prettier": "^3.3.3",
"stylelint": "^16.7.0",
"stylelint-prettier": "^5.0.1"

Please paste any applicable config files that you're using (e.g. .prettierrc or .stylelintrc files)

index.js (prettier config)

{
  "printWidth": 120,
  "tabWidth": 2,
  "useTabs": false,
  "semi": true,
  "singleQuote": true,
  "quoteProps": "as-needed",
  "jsxSingleQuote": false,
  "trailingComma": "all",
  "bracketSpacing": true,
  "bracketSameLine": false,
  "arrowParens": "always",
  "rangeStart": 0,
  "requirePragma": false,
  "insertPragma": false,
  "proseWrap": "preserve",
  "htmlWhitespaceSensitivity": "css",
  "endOfLine": "lf",
  "embeddedLanguageFormatting": "auto",
  "singleAttributePerLine": true,
  "overrides": [
    {
      "files": "**/*.less",
      "options": {
        "singleQuote": false
      }
    }
  ]
}

index.js (stylelint config)

"use strict";

module.exports = {
  "customSyntax": "postcss-less",
  "plugins": [
    "stylelint-order",
    "stylelint-prettier",
    "stylelint-no-unsupported-browser-features",
    "./wrike_plugin/index.js"
  ],
  "rules": {
    "prettier/prettier": true,
    "max-nesting-depth": [3, {
      "ignore": [
        "pseudo-classes",
        "blockless-at-rules"
      ],
      "severity": "warning"
    }],

    "shorthand-property-no-redundant-values": true,

    "declaration-block-no-duplicate-properties": [true, {
      "ignore": ["consecutive-duplicates-with-different-values"]
    }],
    "declaration-block-single-line-max-declarations": 1,

    "block-no-empty": true,

    "selector-type-case": "lower",
    "selector-pseudo-class-no-unknown": [true, {
      "ignorePseudoClasses": ["local"]
    }],
    "selector-pseudo-element-no-unknown": true,
    "selector-pseudo-element-colon-notation": "double",
    "selector-attribute-quotes": "always",
    "selector-max-id": 0,
    "selector-max-universal": 1,

    "color-named": ["never", {
      "ignore": ["inside-function"]
    }],
    "color-hex-length": "long",

    "function-name-case": "lower",
    "function-url-quotes": "always",
    "function-calc-no-unspaced-operator": true,
    "function-linear-gradient-no-nonstandard-direction": true,

    "length-zero-no-unit": true,

    "unit-no-unknown": true,

    "at-rule-no-unknown": true,

    "comment-whitespace-inside": "always",

    "order/properties-order": [
      require("./config/properties_order"),
      {
        "unspecified": "bottom"
      }
    ]
}

What source code are you linting? This is an example of code from my LESS files:

:local(.host) {
  .className {
    z-index: -1; // should be under content
    outline: none;
    .visuallyHidden();
  }
}

:local(.host).cell--is-truncated {
  &:not(.cell--has-multiline-text) {
    // Left Alignment
    &.cell--left-alignment {
      .cell__content {
        .textTruncateGradientTo(left, size-s);
      }
    }

    // Right Alignment
    &.cell--right-alignment {
      .cell__content {
        .textTruncateGradientTo(right, size-s);
      }
    }
  }
}

What did you expect to happen? So that everything works the same as it did in 5.0.0

What actually happened?

1. Prettier started to change // ...single comments to multi-line /* ... */.
2. It changes LESS mixins to SASS syntax with @

.visuallyHidden() -> @visuallyHidden();

.textTruncateGradientTo(left, size-s); -> @textTruncateGradientTo(left, size-s);

3. And it also changes camelCase to another writing syntax, which breaks the entire code base

.visuallyHidden() -> @visuallyhidden();

.textTruncateGradientTo(left, size-s); -> @texttruncategradientto(left, size-s);

I have got new errors after your updates .

lib/src/components/dnd-preview/dnd-preview.less
[lint:style]   53:10  ✖  Replace "TruncateGradientTo" with "truncategradientto·"  prettier/prettier
[lint:style] 
[lint:style] lib/src/components/cells/base/base-cell.less
[lint:style]    92:14  ✖  Replace "TruncateGradientTo" with "truncategradientto·"  prettier/prettier
[lint:style]    99:14  ✖  Replace "TruncateGradientTo" with "truncategradientto·"  prettier/prettier
[lint:style]   110:10  ✖  Replace "TruncateLines" with "truncatelines·"            prettier/prettier

After fix command it formatting my code to

:local(.host) {
  .className {
    z-index: -1; /* should be under content */
    outline: none;
    @visuallyhidden();
  }
}

:local(.host).cell--is-truncated {
  &:not(.cell--has-multiline-text) {
    /* Left Alignment */
    &.cell--left-alignment {
      .cell__content {
        @texttruncategradientto(left, size-s);
      }
    }

    /* Right Alignment */
    &.cell--right-alignment {
      .cell__content {
        @texttruncategradientto(right, size-s);
      }
    }
  }
}

At the moment I have fixed the version 5.0.0 and everything works as before. Can you tell me what to do in this case? Thanks

[dkrnl]

1. Prettier started to fix // ...single comments to multi-line /* ... */.

same issue

[BPScott]

Can you provide all this in a minimum reproduction repository so myself or @dartess can more easily debug?

[dartess]

Got a reproducible example. I'm trying to figure it out.

upd: it's alive!

[BPScott]

Thanks for the fast fixup @dartess!

Fix has been published in v5.0.2

[MrVladevoit]

@dartess thank you for the fast fix ! 🫶 ❤️