lmc-eu / code-quality-tools

Monorepo with some frequently-used configurations we use on frontend projects 🎨
BSD 3-Clause "New" or "Revised" License
16 stars 0 forks source link

Stylelint vs. Prettier compatibility issue #22

Open adamkudrna opened 3 years ago

adamkudrna commented 3 years ago

Prettier prefers:

margin-bottom: tools.rem2em(
    tokens.$space-6,
    tools.rem2em(tokens.$heading-small-desktop)
);

Stylelint prefers:

margin-bottom: tools.rem2em(tokens.$space-6, tools.rem2em(tokens.$heading-small-desktop));

This does not work either:

margin-bottom:
    tools.rem2em(
        tokens.$space-6,
        tools.rem2em(tokens.$heading-small-desktop)
    );

Workaround: disable either Stylelint or Prettier for that line / code block.

It seems there might be a conflict of declaration-colon-space-after and declaration-colon-newline-after Stylelint rules.

literat commented 3 years ago

@adamkudrna What about to extend those rules with project specific configuration?

adamkudrna commented 3 years ago

Well, because it would be project specific 🙂. I think this is a compatibility issue in configuration of two linters commonly used together. I believe our configs should be mutually compatible, so I filed this bug.

This particular problem may get resolved by #21 (the single-line version is 95 characters long), but it's just a question of time when it bubbles up again.

literat commented 2 years ago

I think that this is a problem with line width. I have just merged configuration of prettier where we are setting line width to 120, see https://github.com/lmc-eu/code-quality-tools/pull/29.

I think this should fix this issue. Please check it and let me know if this works. Thanks.