解析LESS变量时,stylelint引发rule- *错误

时间:2019-03-28 09:42:32

标签: webpack postcss stylelint postcss-loader less-loader

我在Webpack配置中将#ifdefs用作stylelint插件。在链的更上游(因此在postcss-loader之后执行),我也使用了postcss。所有依赖项均在其最新版本中使用。

webpack.config.js

less-loader

一切正常,如果存在,棉绒会引发有意义的错误。但是,由于我在camelCase表示法中添加了一个较小的变量,所以我也遇到了... 'less-loader', { loader: 'postcss-loader', options: { plugins: [ require('stylelint')({ "extends": "stylelint-config-standard" }) ] } } ... 相关的错误:

at-rule-*

这似乎曾经是一个已知问题,但根据变更日志,应该使用9.8.0进行了修复:https://github.com/stylelint/stylelint/blob/master/CHANGELOG.md#980

  • 已修复:对较少的变量和混合(#3767)的规则-*误报。

这些是我的(1:1) Expected "fadeAnimDuration:" to be "fadeanimduration:" (at-rule-name-case) ... (1:1) Unexpected unknown at-rule "@fadeAnimDuration:" (at-rule-no-unknown) 文件中被删除的行:

.less

我做错什么了吗?

我可以摆脱将变量更改为@fadeAnimDuration: 1480ms; ... some selector { transition: background-color @fadeAnimDuration, color @fadeAnimDuration; } 的驼峰式错误,但是第二个错误仍然存​​在:

@fade-anim-duration

我不想只为了能够使用LESS变量而完全禁用这些规则。

1 个答案:

答案 0 :(得分:0)

在将stylelint用作PostCSS插件时,我相信您需要手动将postcss-loader syntax configuration设置为postcss-less

或者,我推荐这种方法,您可以使用stylelint-webpack-plugin并利用stylelint内置的语法切换功能。