Install Svelte-kit Efficiently (svelte-kit + vite + tailwindcss + daisyui)


NOTE: Svelte-kit requires updated node js in the system
Run this command to create a blank Skelton project
npm create svelte@latest .
or Run
npm create svelte@latest my-app
This will create the project on the current directory
Install node modules This will create the project on the my-app directory
npm i
Run dev Server
npm run dev -- --dev
Add tailwind using npx and svelte-add
npx svelte-add@latest tailwindcss
Install daisyui
npm i daisyui
Open tailwind.config.cjs add daisyui using add this line inside the plugin array require('daisyui')
const config = {
content: ['./src/**/*.{html,js,svelte,ts}'],
theme: {
extend: {}
},
plugins: [require('daisyui')]
};
module.exports = config;
Open app.html then add the theme to html language tag
If you want dark theme of daisyui then
<html data-theme="dark"></html>
Run the dev server
npm run dev -- --host