Question

我昨天整天都在工作，以完成一个Google云端功能，以为约会创建者Vue组件供电。最后一步实际上是使用返回的对象的UI。我打算在允许的日期和时间上使用vuetify日期/时间选择器。

在花费大量时间尝试将vuetify添加到现有项目后仅将其用于组件之后，这导致了来自main.sass的某些类（margin等）的样式错误。

我想为顺风添加一个前缀，但是我没有时间或意愿回到我所有的组件和文件来为所有顺风类添加前缀。

我可以做些什么来确定vuetify类/ css的范围，以免在我尝试使用的两个组件之外引起问题吗？

我可以在编译和组装顺风之后添加vuetify css，以便顺风类赢得先例吗？

我没有要显示的代码，因为它很简单。我以为Google Calendar API将是该组件中最难的部分，但事实证明它会更容易。

Answer 1

我知道现在回答已经太晚了，但我是为像我这样提出这个问题的其他人写这篇文章的。

为了将 Vuetify 添加到使用 Tailwind CSS 且 CSS 类不冲突的现有项目中，您只需在 Vuetify 选项中激活 treeShake。

例如在 Nuxt 项目中，在 nuxt.config.js 中添加以下代码段：

export default {

// Other Configs

vuetify: {
    treeShake: true
  },
}

Answer 2

Tailwind允许您在配置文件中为生成的类添加前缀。参见https://tailwindcss.com/docs/configuration