如何正确配置 Tailwind CSS 和 VS Code 以至少禁用 VueJS 单文件组件 (vue-cli) 内有关 at-rule 和空标记错误的错误？
<template>
...
</template>
<style lang="scss">
body {
// } expected
@apply font-source pt-4;
} // at-rule or selector expected
h5,h4,h3,h2,h1 {
// } expected
@apply font-pt font-bold;
} // at-rule or selector expected
</style>
我在这个的帮助下让它工作guide https://www.meidev.co/blog/visual-studio-code-css-linting-with-tailwind/
TLDR
安装 VS Code 插件 stylelint （发布者名称：stylelint）
-
禁用项目的 scss / css 验证。按 F1 并搜索“settings json”。
设置.json
"scss.validate": false
"css.validate": false
- Add and configure stylelint plugin. Add the following file and contents to your project root.
stylelint.config.js
module.exports = {
rules: {
'at-rule-no-unknown': [
true,
{
ignoreAtRules: ['tailwind', 'apply', 'variants', 'responsive', 'screen']
}
],
'declaration-block-trailing-semicolon': null,
'no-descending-specificity': null
}
}
- （可选）您“可能”需要重新启动 vs code 才能看到更改
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
