Как скомпилировать один файл .svelte из приложения Sveltekit в качестве веб -компонента? ⇐ Javascript

[Anonymous]

У меня есть приложение Sveltekit 2/Svelte 5 с конфигурацией вне коробки-что вы получаете, запустив NPX SV Create my-app . Я хочу построить свое приложение нормально с помощью адаптерного узла , но я также хочу создать один файл .svelte в качестве веб-компонента, который я могу повторно использовать в других проектах.
В настоящее время моя настройка такова: < /p>

Код: Выделить всё

// $lib/widget/MyComponent.svelte




let counter = $state(0)


 (counter += 1)}>
Clicked {counter} times

< /code>
// svelte.config.js

import { mdsvex } from 'mdsvex'
import adapter from '@sveltejs/adapter-node'
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'

const config = {
preprocess: [vitePreprocess(), mdsvex()],
kit: {
adapter: adapter(),
},
extensions: ['.svelte', '.svx'],
}

export default config
< /code>
// vite.widget.config.ts

import { svelte } from '@sveltejs/vite-plugin-svelte'

export default {
build: {
lib: {
entry: 'src/lib/widget/MyComponent.svelte',
name: 'MyComponent',
fileName: (format) => `my-component.${format}.js`,
formats: ['es'],
},
rollupOptions: {
external: ['svelte'],
output: {
globals: {
svelte: 'svelte',
},
},
},
sourcemap: 'inline',
},
plugins: [
svelte({
compilerOptions: {
customElement: true,
},
}),
],
}
< /code>
vite build --config vite.widget.config.ts
< /code>



< /code>
It works, but I'm not sure if this is the correct way to do it.
I'm getting a warning in my .svelte file that I haven't specified customElement: true

, но это потому, что у меня есть параметры компилятора в vite.widget.config.ts .
Я попытался посмотреть на документы Svelte/Compiler, но я не мог Не понимаю, как я должен использовать этот модуль.
Любые советы приветствуются!

Подробнее здесь: https://stackoverflow.com/questions/793 ... -component