Update for sveltekit?

[djmaze]

It seems this library is not yet compatible with the new sveltekit (beta). As there is no App.svelte anymore, I tried adding an import 'chota' to $layout.svelte, but the compilation fails:

SyntaxError: Unexpected token ':'                                 [0/5423]
    at wrapSafe (internal/modules/cjs/loader.js:979:16)
    at Module._compile (internal/modules/cjs/loader.js:1027:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:
10)               
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at nodeRequire (/tmp/svelte-chota-test2/node_modules/vite/dist/node/ch
unks/dep-60ed4f87.js:69069:17)       
    at ssrImport (/tmp/svelte-chota-test2/node_modules/vite/dist/node/chun
ks/dep-60ed4f87.js:69027:20)         
    at eval (/tmp/svelte-chota-test2/src/routes/$layout.svelte:7:31)

Not sure how to get this working.

[AlexxNB]

Try this in vite section of the kit config:

 ...
  optimizeDeps: {
    exclude: ['chota']
  },
  ...

[djmaze]

// svelte.config.cjs
const preprocess = require('svelte-preprocess');

/** @type {import('@sveltejs/kit').Config} */
module.exports = {
    // Consult https://github.com/sveltejs/svelte-preprocess
    // for more information about preprocessors
    preprocess: preprocess(),

    kit: {
        // hydrate the <div id="svelte"> element in src/app.html
        target: '#svelte',
        vite: {
            optimizeDeps: {
                exclude: ['chota']
            }
        }
    }
};

That unfortunately did not help.

[juodumas]

You can use import 'chota/dist/chota.css' instead of import 'chota'.

[jjgumucio]

You can use import 'chota/dist/chota.css' instead of import 'chota'.

Worked for me! Thanks!

[VirgileD]

I try to use svelte-chota with SvelteKit, so maybe it's related but when I

<Nav>
<a slot="left" >Menu1</a>
<a slot="left" >Menu2</a>
</Nav>

It throws: Duplicate slot name "left" in <Nav> Any advice?

[AlexxNB]

@VirgileD https://github.com/AlexxNB/svelte-chota/issues/25#issuecomment-818639718

[VirgileD]

Oh, yes indeed, tx @AlexxNB !!