vite-plugin-svelte: get/set/hasContext doesn't work in production code outside a component

Describe the bug

I’m trying to use the context functions in library code. They work when using both vite dev and vite preview when linking to the library directly. But when publishing to npm and including the library from there, an exception is thrown (see the logs).

Reproduction

  1. Create a new sveltekit todo app
  2. Add this code to +layout.svelte:
import { Flash } from "sveltekit-flash-message/client"
import { page } from '$app/stores'

const flash = new Flash(page)
const message = flash.message

Explanation

new Flash(page) calls hasContext in its constructor, throwing the error since hasContext cannot find current_component at that point. Code: https://github.com/ciscoheat/sveltekit-flash-message/blob/c5198a35b724d53e0eab780e16d09c7c5c1499fb/src/lib/client.ts#L61-L66

Stackblitz reproduction

https://stackblitz.com/edit/sveltejs-kit-template-default-ask2u7?file=src%2Froutes%2F%2Blayout.svelte&terminal=dev

Logs

Error: Function called outside component initialization
    at get_current_component (file:///E:/Projects/TEST/svelte-next/node_modules/.pnpm/svelte@3.49.0/node_modules/svelte/internal/index.mjs:953:15)
    at hasContext (file:///E:/Projects/TEST/svelte-next/node_modules/.pnpm/svelte@3.49.0/node_modules/svelte/internal/index.mjs:995:12)
    at debugflash (file:///E:/Projects/TEST/svelte-next/node_modules/.pnpm/sveltekit-flash-message@0.6.6/node_modules/sveltekit-flash-message/client.js:52:7)
    at file:///E:/Projects/TEST/svelte-next/.svelte-kit/output/server/entries/pages/_layout.svelte.js:16:3
    at Object.$$render (file:///E:/Projects/TEST/svelte-next/.svelte-kit/output/server/chunks/index.js:89:18)
    at file:///E:/Projects/TEST/svelte-next/.svelte-kit/output/server/index.js:36:97
    at $$render (file:///E:/Projects/TEST/svelte-next/.svelte-kit/output/server/chunks/index.js:89:18)
    at Object.render (file:///E:/Projects/TEST/svelte-next/.svelte-kit/output/server/chunks/index.js:97:20)
    at render_response (file:///E:/Projects/TEST/svelte-next/.svelte-kit/output/server/index.js:938:29)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

System Info

System:
    OS: Windows 10 10.0.19043
    CPU: (16) x64 Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz
    Memory: 43.25 GB / 63.93 GB
  Binaries:
    Node: 16.16.0 - C:\Program Files\nodejs\node.EXE
    npm: 8.11.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (104.0.1293.70)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    @sveltejs/adapter-auto: next => 1.0.0-next.71
    @sveltejs/kit: next => 1.0.0-next.460
    svelte: ^3.49.0 => 3.49.0
    vite: ^3.1.0-beta.1 => 3.1.0-beta.1

Severity

blocking all usage of SvelteKit

Additional Information

No response

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Comments: 19 (11 by maintainers)

Most upvoted comments

@dominikg Just updated my library and can confirm the issue has been resolved by adding svelte to peerDependencies. Thanks!

This sounds like Vite does somehow create a separate Svelte runtime instance for the library. Your package is using @sveltejs/package which rules one source of errors out, which is good. I wonder if it’s because your package doesn’t contain Svelte components, yet it uses functions from it, so vite-plugin-svelte doesn’t detect it’s related to Svelte and doesn’t handle it specifically or something. cc @dominikg @bluwy