Svelte, Skeleton, Tailwind npm install error

Question

I pretty new on svelte/typescript world and since yesterday suddenly I get some errors after installation. I did the exact same things since a few days ago and I can't understand what is happening.

This is my what i did:

npm create svelte@latest diceGame

cd diceGame

npm install

Then I installed Skeleton

npm i @skeletonlabs/skeleton --save-dev

Then I installed Tailwind

npx svelte-add@latest tailwindcss

npm install

Now I get error as you can see in screenshot

Any help/suggestions for what could I do to have a clean installation?

Answer 1

Follow the skeleton UI get started documentation.

I have followed these steps a few times lately and never had an issue.

npm create svelte@latest diceGame
cd diceGame
npm i
npm i -D @skeletonlabs/skeleton @skeletonlabs/tw-plugin
npx svelte-add@latest tailwindcss
npm i
npm add -D @types/node

Then, setup your Tailwind configuration using the .ts file extension.

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: 'class',
    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)
        skeleton
    ]
} satisfies Config;

export default config;