安装依赖并生成 tailwind.config.jspostcss.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';