解决Naive UI和Tailwindcss样式覆盖问题 ​

解决方案 ​

方案一 ​

在 main.js / main.ts 文件中添加以下代码，主要原理是需要在应用初始化之前将 naive-ui-style 提前注入到应用当中，避免被覆盖

// 添加 meta 标签，用于处理使用 Naive UI 和 Tailwind CSS 时的样式覆盖问题
  const meta = document.createElement('meta')
  meta.name = 'naive-ui-style'
  document.head.appendChild(meta)

方案二 ​

或者，可以在 index.html 根路径下的 head 元素中加入一个 / 元素

<html>
  ...
  <meta name="naive-ui-style" />
  ...
</html>

衍伸阅读 ​

Contributors ​

Kano Zhao