如何去掉vscode保存tailwind时候的空格？

Question

用vscode开发tailwind,插件是volar,保存会在css里面加空格，导致黑暗模式dark报错

错误信息：

The `dark:` class does not exist. If `dark:` is a custom class, make sure it is defined within a `@layer` directive

代码：

<style>
/* dark: bg-active-dark dark:text-active-normal */
.btn {
  @apply  bg-gray-700  dark: bg-active-dark
}
</style>

求助，怎么配置才能去掉这个空格

Answer 1

加空格应该是volar的格式化配置的, 关了就行
报错已经提示你了:

Answer 2

使用 @layer 呢？

@layer components {
    .btn {
        @apply bg-gray-700 dark:bg-active-dark    
    }
}