Open tzwm opened 10 months ago
I have the same issue. I made an example/+page.svelte
with almost exactly the example given on the README and it encounters the same error.
<script lang="ts">
import { Editor, Viewer } from 'bytemd'
import gfm from '@bytemd/plugin-gfm'
let value: string = "";
const plugins = [
gfm(),
// Add more plugins here
]
function handleChange(e) {
value = e.detail.value
}
</script>
<style type="text/css">
@import "bytemd/dist/index.css";
</style>
<template>
<Editor {value} {plugins} on:change={handleChange} />
</template>
I dug a bit further on this and concluded it's because Bytemd doesn't like Vite / Sveltekit out-of-the-box.
Adding
export default defineConfig({
// ...
optimizeDeps: { exclude: ["bytemd"]},
}
To my vite.config.js
file seems to have resolved that error.
I don't know what happened with this repository: there was already an issue on this, but it disappeared: https://github.com/bytedance/bytemd/issues/269 (broken link). I guess the maintainers deleted the repo and recreated it under the same name, thus loosing the previous issues.
Nevertheless, I can confirm that @afiorillo 's solution works (I reported the trick in the issue above)
Additionally, we have a warning (with sveltekit v2 & svelte v4)
[vite-plugin-svelte] WARNING: The following packages have a svelte field in their package.json but no exports condition for svelte.
bytemd@1.21.0
Please see https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md#missing-exports-condition for details.
This fix didn't work for me.
This fix didn't work for me. either, I'm using vue-cli
Does not work at all. The whole lib seems to be broken on sveltekit.
I used this package in the Svelte: