stylelint-processor-styled-components icon indicating copy to clipboard operation
stylelint-processor-styled-components copied to clipboard

Distinguish helpers/mixins from component styles

Open TrevorBurnham opened this issue 6 years ago • 5 comments

I'm trying to write an in-house stylelint rule that we want to apply to mixins, e.g.

const mixin = css`
  /* Linter rule SHOULD apply here */
`;

but not to styled components, e.g.

const Component = styled.div`
  /* Linter rule should NOT apply here */
`;

Basically I want to access the result of isHelper() from within a stylelint rule. One way I could imagine this being implemented is to add another map to index.js (e.g. isHelperMap) and export it, so that in my rule I could run this check:

const { isHelperMap } = require('stylelint-processor-styled-components');

module.exports = stylelint.createPlugin(
  ruleName,
  (actual, secondary, context) => {
    return function(root, result) {
      if (isHelperMap[root.source.input.file]) {
        // ...
      }
    }
  }
);

It might be even more useful to provide the type of helper in the map, e.g. "css", "keyframes", or "injectGlobal".

TrevorBurnham avatar Jan 07 '19 20:01 TrevorBurnham

It shares part of #253. And I don't think another processor should depend on this processor to parse helper names. Maybe a common util package is better.

chinesedfan avatar Mar 21 '19 03:03 chinesedfan

@chinesedfan I like the approach in #258, but for that to be a solution here I'd need to be able to map different rules to different moduleName/importName settings. E.g. I want most rules to apply to all style blocks, but I want one rule to apply only to css blocks.

TrevorBurnham avatar Apr 02 '19 01:04 TrevorBurnham

And I don't think another processor should depend on this processor to parse helper names. Maybe a common util package is better.

@TrevorBurnham I mistook your in-house rule as another processor. But the conclusion is the same. You'd better distinguish helpers/mixins by your rule itself, instead of depending on this processor.

chinesedfan avatar Apr 02 '19 02:04 chinesedfan

You'd better distinguish helpers/mixins by your rule itself, instead of depending on this processor.

That's just the problem: As far as I can tell, there's no way for my rule to distinguish between helpers and mixins. Can you think of a way?

TrevorBurnham avatar Apr 02 '19 02:04 TrevorBurnham

I am afraid not. Because rules have no information about the original codes.

codes -> processors -> css -> rules

On the other side, your problem seems not to be an issue belongs to this processor.

chinesedfan avatar Apr 02 '19 03:04 chinesedfan