安装包
npm install -D tailwindcss
初始化配置文件tailwindcss.config.js
npx tailwindcss init
在 tailwind.config.js
文件中添加所有模板文件的路径。
module.exports = {
content: ["./src/**/*.{vue,js,ts,jsx,tsx}",'./public/index.html'],
important:true,
theme: {
extend: {},
},
plugins: [],
}
在/src/assets
下面新建index.css,内容如下
@tailwind base;
@tailwind components;
@tailwind utilities;
在package.json
里面新增如下
"scripts":{
"watch":"npx tailwindcss -i ./src/input.css -o ./src/output.css --watch"
}
在main.js
引入
import '@/assets/output.css'
运行
// 先运行
npm run watch
// 在运行启动项目的命令
npm run serve