安装依赖并生成 tailwind.config.js
和 postcss.config.js
。
yarn add -D tailwindcss postcss autoprefixer
npx tailwindcss init -p
注意,配置中要使用 ES6 模块语法 export default
。
// tailwind.config.js
export default {
content: [
"./index.html",
"./src/**/*.{vue,js,ts,jsx,tsx}",
],
theme: {
extend: {},
},
plugins: [],
};
添加 Tailwind 的 CSS 文件。
/* src/index.css */
@tailwind base;
@tailwind components;
@tailwind utilities;
在 main.js
中引入。
// main.js
import './index.css';