排除 class 被 Tailwind 摇树

Question

有没有办法将某些 类 排除在 tree-shaking 之外？我问的原因是在我的 JavaScript 中我使用的是 arbitrary-value 例如bg-[url('/img/hero-pattern.svg')] 但 url 通过 Vue 计算传递 属性 例如

`bg-[url('${this.image}')]`

我不认为这是被认可的，虽然我不确定。

我知道如何将 tailwind.config.js 与 purge 选项一起使用，但问题似乎不存在，因为包含了 Vue 组件中的其他 类 .

我正在使用 mode: 'jit' 选项来允许任意值。

Answer 1

我刚注意到 safelisting which I am using with Nuxt. I will use this in combination with advice based on this Github issue comment by using safelisting patterns 例如

    options: {
      safelist: {
        greedy: [
          /^bg-/
        ]
      }
    }

不幸的是，在我的用例中，由于计算的 class 名称是 not supported，我无法使用上面的内容。相反，我不得不使用内联样式。