tailwind-editor icon indicating copy to clipboard operation
tailwind-editor copied to clipboard

Does it work with SvelteKit?

Open vakopian opened this issue 4 years ago • 3 comments

Hello, I'm trying to use this component in a SvelteKit app, but I'm encountering some css loading issues (see below). I saw there is a demo repo for using this editor with Sapper, but I'm wondering if there are known issues with SvelteKit. Here is what I've tried:

npm init svelte@next
npx svelte-add@latest tailwindcss
npm install
npm install -D tailwind-editor

But when I use the simple <Editor /> example given in the main page of this repo, I get lots of issues with tailwind styles not being properly loaded for the editor. Is there some special configuration I need to adjust to make it work for SvelteKit?

vakopian avatar Oct 20 '21 03:10 vakopian

I downgraded tailwindcss from the latest 2.2.16 to 2.0.4 and the editor started working! It would be good if the version dependency could be made explicit either in the main readme or in package.json for this component.

vakopian avatar Oct 20 '21 05:10 vakopian

I still have problems to import it regarding using window on ssr. How did you solve it?

Pedroglp avatar May 23 '23 16:05 Pedroglp

I still have problems to import it regarding using window on ssr. How did you solve it?

<script lang="ts">
import { browser } from '@svelte/kit'

if ( browser) {
   //  ... client side js here
}

</script>

maietta avatar May 23 '23 19:05 maietta