Type error in the config: Binding element 'theme' implicitly has an 'any' type.
illright opened this issue · 3 comments
illright commented
What version of @tailwindcss/typography are you using?
v0.5.10
What version of Node.js are you using?
v18.18.0
What browser are you using?
N/A
What operating system are you using?
Linux
Reproduction repository
https://stackblitz.com/edit/vitejs-vite-pjylzr?file=tailwind.config.ts
Describe your issue
When accessing the theme function in the tailwind.config.ts file for the typography key, there is a TypeScript error Binding element 'theme' implicitly has an 'any' type..
Here's the problematic config:
import typography from '@tailwindcss/typography';
/** @type {import('tailwindcss').Config} */
export default {
content: [],
theme: {
extend: {
// Binding element 'theme' implicitly has an 'any' type.
typography: ({ theme }) => ({
DEFAULT: {
css: {
color: theme('colors.pink[800]'),
},
},
}),
},
},
plugins: [typography],
};I managed to work around this by importing PluginUtils and making that the type of the { theme } object:
import type { PluginUtils } from "tailwindcss/types/config";
export default {
theme: {
extend: {
typography: ({ theme }: PluginUtils) => ({})
}
}
}meghantosh commented
Thank you! That also worked for me
petrpacas commented
Thank you
philipp-spiess commented
Thanks for this issue!
I'm going to close this now though since we've "v4-ified" the README and with CSS variables it's no longer needed to use the theme function inside the JavaScript config in most cases. Hopefully people will still find this if they need to, though!