Setup TypeScript

Call the makeTheme function, add declaration merging, and you get amazing intellisense and TypeScript support.

import { makeTheme } from 'dripsy'
const theme = makeTheme({
// your theme
type MyTheme = typeof theme
declare module 'dripsy' {
// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface DripsyCustomTheme extends MyTheme {}


If you don't see autocomplete, there could be a few reasons.

  1. You need to restart VSCode (yeah, really)
  2. You need at least TypeScript 4.4+: yarn add -D typescript
  3. [rare] You might have multiple versions of ts-toolbelt installed. Try yarn why ts-toolbelt. If this is the case, use yarn resolutions in your package.json:
"resolutions": {
"ts-toolbelt": "^9.6.0"

You're ready!

You now have awesome TypeScript intellisense for your theme, throughout your app.