如何解决TS7031错误：绑定元素addUtilities隐式具有any类型

这个报错本质是TypeScript无法自动推断addUtilities的类型，你可以通过以下几种方式解决：

1. 为Tailwind配置文件添加正确的类型约束 #

如果你是在Tailwind CSS的配置文件中使用addUtilities，直接用Tailwind提供的Config类型和satisfies关键字约束整个配置对象即可：

import type { Config } from 'tailwindcss';
import plugin from 'tailwindcss/plugin';

export default {
  content: ['./src/**/*.{js,ts,jsx,tsx}'],
  theme: {
    extend: {},
  },
  plugins: [
    plugin(({ addUtilities }) => {
      addUtilities({
        '.text-shadow': {
          textShadow: '0 2px 4px rgba(0,0,0,0.1)',
        },
      });
    }),
  ],
} satisfies Config;

2. 显式指定插件函数的参数类型 #

如果是自定义独立插件，可以直接导入Tailwind的TailwindPluginAPI类型，为函数参数标注类型：

import type { TailwindPluginAPI } from 'tailwindcss/types';
import plugin from 'tailwindcss/plugin';

const customUtilitiesPlugin = plugin(({ addUtilities }: TailwindPluginAPI) => {
  addUtilities({
    '.custom-padding': {
      padding: '1.5rem',
    },
  });
});

// 在Tailwind配置中使用该插件
export default {
  // 其他配置...
  plugins: [customUtilitiesPlugin],
} satisfies Config;

3. 确保安装了Tailwind的类型依赖 #

如果还没安装相关类型包，先执行以下命令安装：
npm install -D @types/tailwindcss

这样TypeScript就能识别Tailwind API的类型，避免隐式any的报错。

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