Environments:

• Prettier Version: 1.14.3
• Running Prettier via: CLI, Node.js
• Runtime: Node.js v8
• Operating System: macOS

Steps to reproduce:

From issue raised with Stylelint stylelint/stylelint#3854

Clearly describe the bug

It's not clear to me in which package this problem is being caused, but when I add stylelint-prettier and enable the 'prettier/prettier': true, then stylelint reports each as CssSyntaxError Unknown word.

Which rule, if any, is the bug related to?

prettier/prettier

What CSS is needed to reproduce the bug?

@selectors-color: primary, secondary, info, success, warning, error, dark, light;

@primary: #007bff;
@secondary: #6c757d;
@info: #17a2b8;
@success: #28a745;
@warning: #ffc107;
@error: #dc3544;
@dark: #343a40;
@light: #f8f9fa;

each(@selectors-color, {
  .bg-@{value} {
    background-color: @@value;
  }
});

What stylelint configuration is needed to reproduce the bug?

/**
 * @file Manages the root configuration settings for project wide stylelint.
 * @module stylelint/root/configuration
 * @version 1.0.0
 * @see {@link https://stylelint.io/} for further information.
 */

module.exports = {
  /**
   * Extend an existing configuration.
   * @type {string|Array.<string>}
   * @see {@link https://github.com/stylelint/stylelint/blob/master/docs/user-guide/configuration.md#extends}
   */
  extends: [
    /**
     * The standard shareable config for stylelint.
     * @type {string}
     * @see {@link https://github.com/stylelint/stylelint-config-standard}
     */
    'stylelint-config-standard',
    /**
     * Turns off all rules that are unnecessary or might conflict with prettier.
     * @type {string}
     * @see {@link https://github.com/shannonmoeller/stylelint-config-prettier}
     */
    'stylelint-config-prettier',
  ],

  /**
   * @type {Array.<string>}
   */
  plugins: [
    'stylelint-prettier',
    'stylelint-no-unsupported-browser-features',
    'stylelint-declaration-strict-value',
  ],

  /**
   * @type {Array.<string>}
   */
  processors: [], // do not include empty

  /**
   * @type {!Object}
   */
  rules: {
    'no-empty-source': null,
    'no-missing-end-of-source-newline': null, // currently has a bug #3428
    'prettier/prettier': true,
    'plugin/no-unsupported-browser-features': [true, {
      severity: 'warning',
    }],
    'scale-unlimited/declaration-strict-value': ['color', {
      ignoreKeywords: 'inherit',
    }],
  },
};

postcss.config.js

const postcssHTML = require('postcss-html');
const postcssURL = require('postcss-url');
const postcssSafe = require('postcss-safe-parser');
const postcssAutoprefixer = require('autoprefixer');

module.exports = {
  plugins:  [postcssHTML, postcssURL, postcssSafe, postcssAutoprefixer],
};

Which version of stylelint are you using?

  "devDependencies": {
    "less": "^3.9.0",
    "postcss": "^7.0.7",
    "postcss-cssnext": "^3.1.0",
    "postcss-html": "^0.34.0",
    "postcss-less": "^3.1.0",
    "postcss-loader": "^3.0.0",
    "postcss-safe-parser": "^4.0.1",
    "postcss-sass": "^0.3.5",
    "postcss-scss": "^2.0.0",
    "postcss-syntax": "^0.34.0",
    "postcss-url": "^8.0.0",
    "prettier": "^1.14.3",
    "stylelint": "^9.9.0",
    "stylelint-config-prettier": "^4.0.0",
    "stylelint-config-standard": "^18.2.0",
    "stylelint-declaration-strict-value": "^1.1.2",
    "stylelint-formatter-pretty": "^1.0.3",
    "stylelint-no-unsupported-browser-features": "^3.0.2",
    "stylelint-prettier": "^1.0.5",
  },

How are you running stylelint: CLI, PostCSS plugin, Node API?

CLI from package.json with "lint:css": "stylelint '**/test.{css,less,vue}'"

Does the bug relate to non-standard syntax (e.g. SCSS, Less etc.)?

Yes, it's related to LESS each

What did you expect to happen?

No warnings or error to be flagged.

What actually happened (e.g. what warnings or errors did you get)?

> stylelint '**/test.{css,less,vue}'

SyntaxError: (postcss) CssSyntaxError Unknown word (12:1)
  10 | @light: #f8f9fa;
  11 | 
> 12 | each(@selectors-color, {
     | ^
  13 |   .bg-@{value} {
  14 |     background-color: @@value;
  15 |   }
    at createError (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/parser-postcss.js:19093:15)
    at parseWithParser (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/parser-postcss.js:19001:11)
    at Object.parse (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/parser-postcss.js:19036:12)
    at Object.parse$2 [as parse] (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/index.js:7138:19)
    at coreFormat (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/index.js:10398:23)
    at format (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/index.js:10570:16)
    at formatWithCursor (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/index.js:10582:12)
    at /Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/index.js:34924:15
    at Object.format (/Users/grahamfairweather/source/i-view-core-x/node_modules/prettier/index.js:34943:12)
    at /Users/grahamfairweather/source/i-view-core-x/node_modules/stylelint-prettier/stylelint-prettier.js:77:39

Issue was closed stylelint/stylelint#3854 (comment)

It's an error in prettier, which uses an old version of the postcss-less parser, which doesn't support each.