'Expected "dummyValue" to be "dummyvalue"' error after update to 20.0.0 about stylelint-config-standard HOT 3 CLOSED

@marco-streng Thanks for the clearly written report and for using the template.

The styled-components processors is introducing the dummyValue.

We're discouraging the use of processors in favour of the built-in syntaxes. However, it's not that clear cut as the built-in syntax for CSS-in-JS has:

• bugs to squash
• features to add for parity

I recommend trying to see if you can use stylelint on your code without the processor. If that proves problematic, you can either:

• turn the value-keyword-value rule of completely
• configure it to ignore these keywords

You can do the former with:

{
  "rules": { "value-keyword-case": null }
}

And the latter with:

{
  "rules": { "value-keyword-case": ["lower", { "ignoreKeywords": ["dummyValue"] }] }
}

If removing the processor does prove problematic, please can you tell us about your experience especially if you uncover bugs that are not already documented in stylelint/stylelint#4574, so that we can improve the built-in CSS-in-JS syntax in preparation for the eventual deprecation of the processors.

from stylelint-config-standard.

@jeddy3 I don't use styled-components processors and plugins my config is as simple as this:

module.exports = {
  extends: ['stylelint-config-standard'],
};

But I get the above error whenever I try to use a camelCase prop in my styled-component css. I think you cannot distinguish between the css attributes and js variables.

const StyledComp = styled.div`
  background: ${({ isSubPart, theme }) => !isSubPart && theme.pallette.primary};
  border-radius: 0px 4px 4px 0px;
`;

I get the following error in the above code which is wrong:
Expected "isSubPart" to be "issubpart" (value-keyword-case)

IMHO you can add this bug to stylelint/stylelint#4574 list

from stylelint-config-standard.

I've came across this problem as well. Any progress?

from stylelint-config-standard.