Tailwind v3.2.4：@apply样式不生效及VSCode警告问题求助

一、修复@apply不生效问题 #

1. 修正样式表链接拼写错误
   你的index.html里样式表链接少了字母t，导致本地style.css未正确加载：

   <!-- 错误写法 -->
   <link rel="styleshee" href="style.css" />
   <!-- 正确写法 -->
   <link rel="stylesheet" href="style.css" />
   

2. 移除CDN版Tailwind脚本
   同时使用本地PostCSS编译的Tailwind和CDN版脚本会产生冲突，且CDN模式不支持自定义@apply组件，删除该行：

   <script src="https://cdn.tailwindcss.com"></script>
   

3. 调整tailwind.config.js的content扫描路径
   当前配置仅扫描src目录下的文件，但你的index.html在根目录，导致Tailwind无法识别页面中使用的自定义类，修改content字段：

   /** @type {import('tailwindcss').Config} */
   module.exports = {
     content: ["./index.html", "./src/**/*.{html,js}"], // 添加上根目录的index.html
     theme: {
       extend: {},
     },
     plugins: [],
   }
   

二、解决VSCode「Unknown at rule @apply」警告 #

1. 安装VSCode插件Tailwind CSS IntelliSense
2. 打开VSCode设置（快捷键Ctrl+,），添加以下配置：

   "css.validate": false,
   "tailwindCSS.includeLanguages": {
     "css": "postcss"
   }
   

完成以上操作后，重启Vite服务和VSCode，@apply样式即可生效，警告也会消失。

内容的提问来源于stack exchange，提问作者Marya