安装配置

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p  // 生成配置文件：tailwind.config.js

在生成的tailwind.config.js文件下插入：

/** @type {import('tailwindcss').Config} */
export default {
  // 提取src文件夹中的下述文件进行处理，分析这些文件使用了哪些类
  // 再将这些类进行从tailwindcss中提取，用什么提取什么，防止打包的文件过大
  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  theme: {
    extend: {},
  },
  plugins: [],
}

在原先的全局样式文件中写入：原先的是style.css，可以修改为tailwindcss.css，tailwindcss.css的内容为：

@tailwind base;
@tailwind components;
@tailwind utilities;

最后并在main.js文件中进行全局引入即可

import './tailwindcss.css'

我们可以将其定义成插件的形式，详细查看编写的前端脚手架项目

在编写代码的时候，推荐安装Tailwind CSS IntelliSense插件