-
Hello Maximo, me again 😃 This time I am playing around with Svelte components. More precisely, I am trying to use the svelte-typewriter https://www.npmjs.com/package/svelte-typewriter I tried to use it according to your My goal
The browser console says:
What I triedI looked into the components.d.ts and noted that there was no auto-generated import for the Typewriter component. According to declare module 'vue' {
export interface GlobalComponents {
// ...
Typewriter: typeof import('./node_modules/svelte-typewriter/src/Typewriter.svelte')['default']
// ...
}
} But no dice. I added How to reproduceHere is a repository https://github.com/lutuh/iles-svelte-test with two commits:
Thank you very much for pointing me into the right direction on how to properly import a Svelte compoent. Lucas |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
@lutuh Since the component is not in the
Once the component is being resolved correctly, you must also add a hydration directive, as mentioned in the warning in the Supported Frameworks section. <Typewriter client:load/> When using a wrapper component with the Otherwise, you might need to explicitly tell îles about it: <Typewriter client:load using="svelte"/> |
Beta Was this translation helpful? Give feedback.
-
Thank you very much for your answer! The key insight for me was that one has to use |
Beta Was this translation helpful? Give feedback.
@lutuh Since the component is not in the
components
dir, you will need to do one of the following:Create a stub component in
src/components/Typewriter.svelte
that wraps the component:Or import it manually each time you use it:
Or create a custom resolver and add it in
iles.config.ts
:Once the component is being resolved correctly, you must also add a hydration directive, as mentioned in the …