VSCode Tailwind CSS智能提示仅在类名前加空格时生效求助

我已按照Next.js官方Tailwind安装指南完成配置，以下是我的tailwind.config.js文件：

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./app/**/*.{js,ts,jsx,tsx}",
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

但VSCode的Tailwind CSS Intellisense插件仅在类名前添加空格时才会触发智能提示，演示效果：

我怀疑VSCode的settings.json文件存在问题，遂注释掉整个文件，但问题仍未解决，settings.json原内容如下：

{
  "color-highlight.markerType": "dot-before",
  "explorer.confirmDelete": false,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "autoprefixer.formatOnSave": true,
  "autoprefixer.browsers": [
    "last 4 versions",
    "ie >= 9",
    "> 5%"
  ],
  "liveServer.settings.donotShowInfoMsg": true,
  "editor.detectIndentation": false,
  "editor.tabSize": 2,
  "liveServer.settings.donotVerifyTags": true,
  "emmet.includeLanguages": {
    "javascript": "javascriptreact"
  },
  "scss.format.newlineBetweenRules": false,
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "dbaeumer.vscode-eslint",
  "vetur.format.defaultFormatter.js": "prettier-eslint",
  "workbench.settings.openDefaultKeybindings": true,
  "[typescriptreact]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "window.zoomLevel": 1,
}

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