flekschas/svelte-simple-modal

Sapper throws 500 document is not defined

Closed this issue · 3 comments

priyanomi commented

Hi, I am trying to use this component in a sapper project. But it throws the following error:

500
document is not defined

ReferenceError: document is not defined
    at enableScroll (D:\PROJECTS\repos\AriseWebsite\node_modules\svelte-simple-modal\src\Modal.svelte:184:12)
    at close (D:\PROJECTS\repos\AriseWebsite\node_modules\svelte-simple-modal\src\Modal.svelte:132:16)
    at D:\PROJECTS\repos\AriseWebsite\node_modules\svelte-simple-modal\src\Modal.svelte:196:11
    at Object.$$render (D:\PROJECTS\repos\AriseWebsite\node_modules\svelte\internal\index.mjs:1366:23)
    at D:\PROJECTS\repos\AriseWebsite\__sapper__\dev\server\server.js:2246:38
    at Object.$$render (D:\PROJECTS\repos\AriseWebsite\node_modules\svelte\internal\index.mjs:1366:23)
    at Object.default (D:\PROJECTS\repos\AriseWebsite\src\node_modules\@sapper\internal\App.svelte:24:50)
    at D:\PROJECTS\repos\AriseWebsite\__sapper__\dev\server\server.js:2475:66
    at Object.$$render (D:\PROJECTS\repos\AriseWebsite\node_modules\svelte\internal\index.mjs:1366:23)
    at D:\PROJECTS\repos\AriseWebsite\src\node_modules\@sapper\internal\App.svelte:20:18
flekschas commented

Did you make sure to install it as a dev dependency?

document is a global variable available in the browser, so my only other guess is that you're trying to do some kind of SSR?

priyanomi commented

Did you make sure to install it as a dev dependency?

document is a global variable available in the browser, so my only other guess is that you're trying to do some kind of SSR?

Thanks for the reply.
I did install it as dev dependency.
During development (npm run dev) in sapper, I get this error. Which is kind of SSR I guess.

I was able to make it work by following this answer: https://stackoverflow.com/a/63502144/4036999

flekschas commented

Glad you figured it out! I'll update the readme accordingly!