今天使用 nuxt 集成了 naive ui 和 tailwindCss,然后发现组件样式异常:
这是因为 naiveUI 和 tailwindCss 的样式产生冲突,给 tailwindCSS 设置禁止预加载即可
/** @type {import('tailwindcss').Config} */
module.exports = {
// 禁用预加载,修复tailwind样式 与 naive-ui button等样式等冲突问题
corePlugins:{
preflight: false
},
content: [
'./components/**/*.{vue,js,ts}',
'./layouts/**/*.vue',
'./pages/**/*.vue',
'./composables/**/*.{js,ts}',
'./plugins/**/*.{js,ts}',
'./app.{js,ts,vue}'
],
theme: {
extend: {}
},
plugins: []
}
完美解决