顺风在规则中添加@顺风css,标记为未知。 如何避免这种错误?
如styles.css
@tailwind起飞前的;
@tailwind公用事业;
顺风在规则中添加@顺风css,标记为未知。 如何避免这种错误?
如styles.css
@tailwind起飞前的;
@tailwind公用事业;
当前回答
SCSS
如果你正在使用顺风的SASS,你仍然会在你的.scss文件中看到错误,使用这些前面的答案。
要正确地lint SASS,你可以添加到你的VS Code设置:
"scss.validate": false,
按照@hasusuf的指示,但关闭默认的VS Code验证器:
添加以下3个设置:
"css.validate": false,
"scss.validate": false,
"stylelint.enable": true,
其他回答
当前推荐的VS代码设置(更新于2022年12月15日)
官方顺风CSS智能感知VS文档
使用这些文件。associations设置告诉VS Code总是在顺风CSS模式下打开。CSS文件:
"files.associations": {
"*.css": "tailwindcss"
}
提示:按Ctrl +,从VS Code打开设置;然后,输入“Files Associations”。
默认情况下,VS Code在编辑“字符串”内容时不会触发补全,例如在JSX属性值中。更新编辑器。quickrecommendations设置可以改善您的体验:
"editor.quickSuggestions": {
"strings": true
}
结合两者,你的设置。Json文件(如果是新的)将看起来像这样:
{
"files.associations": {
"*.css": "tailwindcss"
},
"editor.quickSuggestions": {
"strings": true
}
}
来源:https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss
以前推荐的VS代码设置(已弃用)
VS Code有内置的CSS验证,当使用tailwind特定的语法时可能会显示错误,比如@apply。你可以在css中禁用它。验证设置:
"css.validate": false
“编辑器。quickrecommendations”设置建议保持不变。结合两者,你的设置。Json文件(如果是新的)看起来类似这样:
{
"css.validate": false,
"editor.quickSuggestions": {
"strings": true
}
}
确保安装PostCSS语言支持,在VSCODE中找到扩展。 这将删除正在显示的错误。
@apply规则兼容postCSS: https://github.com/tailwindcss/tailwindcss/issues/325
VS市场链接:https://marketplace.visualstudio.com/items?itemName=csstools.postcss
注意:从VS Code中卸载PostCSS智能感知和高亮扩展,否则它将无法工作。
现在vscode是可配置的,为了消除这个警告,你可以创建一个名为"。vscode"的文件夹 然后创建一个名为settings。json的新文件 在设置中。Json文件你可以粘贴这个Json
{ “css.lint。unknownAtRules”:“忽略” }
如果顺风css不像未知规则引起的错误那样工作,你需要重新构建它。例如,如果你已经在本地环境中运行了npm run dev,你可以用ctrl + c退出并再次运行npm run dev来创建一个正常的纯CSS文件,这将使顺风CSS工作。
这正是我所遇到的问题以及我是如何解决它的。
只需进入设置(ctrl +,)的快捷方式。
打开设置,搜索“未知”,第一个结果应该是你要找的:CSS > Lint: unknown At Rules:
将其更改为忽略:
完成了!干杯!
还是不明白?跟着图片走