首先下载tailwindcss 样式
https://www.tailwindcss.cn/docs/installation
我们可以按照官方文档来进行配置
npm install -D tailwindcss
npx tailwindcss init
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{html,js}"],
theme: {
extend: {},
},
plugins: [],
}
在这里配置完成后，我们创建一个scss文件
src/assets/styles/tailwindcss.scss
在index.scss导入这个tailwindcss.scss
此时你会发现运行出来的结果，在若依框架中样式不对，与 Element 的css有冲突
我这边写了个样式来查看tailwindcss 是否生效
这里我们可以看到，运行出来的菜单栏样式扭曲了，而我们自己配置的样式是能显示出来的。所以tailwindcss.scss 已经导入成功。但是与Element有冲突
解决方法：
找到这个css文件
我的路径： node_modules/tailwindcss/lib/plugins/css/preflight.css
复制出来
然后粘贴到这个位置，跟main.js同级
找到这里，把svg注视掉
然后导入到main.js 函数里。运行出来。
配置好以后，运行npm run dev
ok 问题解决，遇到类似的情况，可以按照这样的方式去修改
标签：scss,样式,js,若依,冲突,tailwindcss,css From： https://www.cnblogs.com/lidongxiao/p/18298231