styled-components - 如何为所有非字符串值禁用stylelint

在启用样式组件处理器的情况下，是否可以全局关闭插值中的stylelint线夹？我的eslint配置应适用于这种情况，并且我不希望我的stylelint配置干扰它。有什么办法可以解决这个问题？

例如，由于stylelint的CSS value-keyword-case规则，这段代码将产生错误。但是因为它在插值内部（所以它只是JS而没有CSS），所以我想关闭此类地方的棉绒。

const MyStyling = styled.div`
  color: ${props => props.colors.darkPink};
`

我用什么：

{
  "stylelint": "^9.10.1",
  "stylelint-config-standard": "^16.0.0",
  "stylelint-config-styled-components": "^0.1.1",
  "stylelint-processor-styled-components": "^1.5.2"
}

最佳答案

我遇到了同样的问题。

在找不到特定的内容以禁用适用于javascript中非字符串值的stylelint规则之后，我决定在需要使用的几行中禁用value-keyword-case规则，方法是：

/* stylelint-disable-line value-keyword-case */

我的代码示例：

const buttonStyles = css<Props>`
  /* CSS property: value pairs removed for simplicity */
`

const DecoyButton = styled.div`
  ${buttonStyles} /* stylelint-disable-line value-keyword-case */
`

const Button = styled('button').attrs(({ type = 'button' }: Attrs) => ({
  type,
}))`
  ${buttonStyles} /* stylelint-disable-line value-keyword-case */
`

关于styled-components - 如何为所有非字符串值禁用stylelint，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/55536586/