stylelint-config-standard icon indicating copy to clipboard operation
stylelint-config-standard copied to clipboard

Use parameterized custom messages

Open ybiquitous opened this issue 3 years ago • 1 comments

What is the problem you're trying to solve?

This sharable config stylelint-config-standard has defined a custom message for a few rules, for example of the selector-class-pattern:

https://github.com/stylelint/stylelint-config-standard/blob/f569bb130200e22f606a961cf420b54185fd0c90/index.js#L136-L141

A custom message (demo):

Expected class selector to be kebab-case

An original message (demo):

Expected class selector ".FOO" to match pattern "^([a-z][a-z0-9]*)(-[a-z0-9]+)*$"

It would seem more useful if the custom message would become as below:

Expected class selector ".FOO" to be kebab-case

What solution would you like to see?

We have added the experimental feature for custom message formatting via https://github.com/stylelint/stylelint/pull/6312 and the 14.12.0 version, so we can use it here.

I suggest like this:

- message: 'Expected class selector to be kebab-case',
+ message: (value) => `Expected class selector "${value}" to be kebab-case`,

Also, we need to update the built-in rules to enable the custom formatting for the rules using a custom message in stylelint-config-standard. Like this:

- message: messages.expected(selector, primary),
+ message: messages.expected,
+ messageArgs: [selector, primary],

See also the built-in rule code.

Target rules can be as below:

  • custom-media-pattern
  • custom-property-pattern
  • keyframes-name-pattern
  • selector-class-pattern
  • selector-id-pattern

ybiquitous avatar Oct 03 '22 10:10 ybiquitous

Sounds great to me!

jeddy3 avatar Oct 03 '22 13:10 jeddy3