hashmd: Errors when used with SvelteKit

Hello, when i updated to the latest version of everything in my Sveltekit app, I started to get this error on every page with the markdown on it. Both the Viewer and Editor. Any idea what this is or how it can be solved?

proxy.js?v=892a008e:15 [HMR][Svelte] Unrecoverable HMR error in <Markdown>: next update will trigger a full reload

index.mjs:300 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '$$')
    at init (index.mjs:300:46)
    at new Editor (index.mjs:2988:5)
    at create_fragment (Markdown.svelte? [sm]:3:32)
    at init (index.mjs:2031:37)
    at new Markdown (Markdown.svelte? [sm]:13:70)
    at createProxiedComponent (svelte-hooks.js?v=892a008e:341:9)
    at new ProxyComponent (proxy.js?v=892a008e:242:7)
    at new Proxy<Markdown> (proxy.js?v=892a008e:349:11)
    at create_fragment (http://localhost:5173/src/routes/(admin)/admin/deals/[deal]/+page.svelte:309:14)
    at init (index.mjs:2031:37)

About this issue

Original URL
State: closed
Created a year ago
Reactions: 6
Comments: 22 (6 by maintainers)

Most upvoted comments

we had this error. we got it to work by adding

  optimizeDeps: {
    exclude: ['bytemd']
  }

in our vite.config.ts file.

precision:

we use bytemd in routes where SSR and prerendering are disabled
we import the svelte components, not the compiled code.

+25

0gust1 on Apr 5, 2023

This should not be marked as stale. It’s still a issue breaks it’s usage.

seo-rii on Jun 5, 2023

I created a simple reproduction using the latest version of Sveltekit (1.6.0) and ByteMD (1.20.2), and I updated all packages, and pretty much copy and pasted the Svelte usage code from this repo’s README.

https://github.com/Doomd/reproduction-sveltekit-bytemd-broken

I can successfully run the test site with vite dev, but clicking on the links to any pages that have the <Editor /> or <Viewer /> components in them, fails completely (without rendering anything). BUT, if you refresh the browser from the route containing one of the bytemd components (or open the site directly into one of these bytemd containing routes), then the component WILL render, but there are still console errors that will cause the Editor component especially to not function as an editor. I tried enabling/disabling prerendering, ssr, csr…to no avail.

I would have created a Stackblitz repo, but everytime I installed bytemd, upon reloading the code, the entire app would crash due to a memory overload. But I did test the github reproduction only five minutes ago and it causes all major browsers to spit out console errors.

Doomd on Feb 15, 2023

Experiencing the same issue in sveltekit when running with vite dev:

With vite build and vite preview everything works fine.

sveltekit version: 1.3.10

gjolga on Feb 9, 2023

here is a stackblitz using Vite+Svelte (no sveltekit), also erroring: Uncaught TypeError: Cannot read properties of undefined (reading ‘$$’)

https://stackblitz.com/edit/vitejs-vite-tkckzv

It seems to work in my browser, with the CSS import statement uncommented

pd4d10 on Feb 9, 2023

here is a stackblitz using Vite+Svelte (no sveltekit), also erroring: Uncaught TypeError: Cannot read properties of undefined (reading ‘$$’)

https://stackblitz.com/edit/vitejs-vite-tkckzv

warrenshekyls on Feb 9, 2023

Could you please provide a minimal repo for reproduction?

Not my repo but someone else created example. Look in the console with this template project. https://stackblitz.com/edit/sveltejs-kit-template-default-doe5ur?file=src/routes/+page.js

davidh10 on Feb 9, 2023