tailwind.config.ts

import { join } from "path";
import type { Config } from "tailwindcss";

// 1. Import the Skeleton plugin
import { skeleton } from "@skeletonlabs/tw-plugin";

const config = {
    // 2. Opt for dark mode to be handled via the class method
    darkMode: "selector",

    content: [
        "./src/**/*.{html,js,svelte,ts}",
        // 3. Append the path to the Skeleton package
        join(require.resolve("@skeletonlabs/skeleton"), "../**/*.{html,js,svelte,ts}"),
    ],

    theme: {
        extend: {},
    },

    plugins: [
        // 4. Append the Skeleton plugin (after other plugins)
        require("@tailwindcss/typography"),
        skeleton({
            themes: {
                preset: [
                    "skeleton",
                    "wintry",
                    "modern",
                    "rocket",
                    "seafoam",
                    "vintage",
                    "sahara",
                    "hamlindigo",
                    "gold-nouveau",
                    "crimson",
                ],
            },
        }),
    ],
} satisfies Config;

export default config;