How to import bokehjs?

[MatthiasMert]

Disclaimer: I am very new to frontend and might be doing stupid things I dont understand.

I want to use standalone bokehjs in sveltekit. I try to import bokehjs via import * as bokeh from '@bokeh/bokehjs' and get the following error:

(node:65015) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
4:17:56 PM [vite] Error when evaluating SSR module /src/routes/+page.svelte: failed to import "@bokeh/bokehjs"
|- /home/user/Repositories/test-project/myapp/node_modules/@bokeh/bokehjs/build/js/lib/bokeh.js:1
export * from "./main";
^^^^^^

SyntaxError: Unexpected token 'export'
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1176:20)
    at Module._compile (node:internal/modules/cjs/loader:1218:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
    at Module.load (node:internal/modules/cjs/loader:1117:32)
    at Module._load (node:internal/modules/cjs/loader:958:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:194:25)

Internal server error: Unexpected token 'export'
      at internalCompileFunction (node:internal/vm:73:18)
      at wrapSafe (node:internal/modules/cjs/loader:1176:20)
      at Module._compile (node:internal/modules/cjs/loader:1218:27)
      at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
      at Module.load (node:internal/modules/cjs/loader:1117:32)
      at Module._load (node:internal/modules/cjs/loader:958:12)
      at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
      at ModuleJob.run (node:internal/modules/esm/module_job:194:25)
/home/user/Repositories/test-project/myapp/node_modules/@bokeh/bokehjs/build/js/lib/bokeh.js:1
export * from "./main";
^^^^^^

SyntaxError: Unexpected token 'export'
    at internalCompileFunction (node:internal/vm:73:18)
    at wrapSafe (node:internal/modules/cjs/loader:1176:20)
    at Module._compile (node:internal/modules/cjs/loader:1218:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
    at Module.load (node:internal/modules/cjs/loader:1117:32)
    at Module._load (node:internal/modules/cjs/loader:958:12)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:169:29)
    at ModuleJob.run (node:internal/modules/esm/module_job:194:25)

package.json:

{
	"name": "myapp",
	"version": "0.0.1",
	"private": true,
	"scripts": {
		"dev": "vite dev",
		"build": "vite build",
		"preview": "vite preview"
	},
	"devDependencies": {
		"@sveltejs/adapter-auto": "^2.0.0",
		"@sveltejs/kit": "^1.20.4",
		"svelte": "^4.0.5",
		"vite": "^4.4.2"
	},
	"type": "module",
	"dependencies": {
		"@bokeh/bokehjs": "^3.2.1"
	}
}

Can someone tell me what I’m doing wrong?

To reproduce:

• I am using node version v18.16.0 and npm version 9.5.1.
• run npm create svelte@latest myapp && cd myapp && npm i @bokeh/bokehjs && npm install && npm run dev
• choose Skeleton project and javascript
• in routes/+page.svelte wirte:

<script>
    import * as bokeh from '@bokeh/bokehjs';
</script>

• save and reload

Reproduce via Stackblitz (node version v16.20.0; npm version 9.4.2):

• Stackblitz sveltekit link

[Bryan]

cc @mateusz @Philipp_Rudiger