kit: (imported default) is not a function
Describe the bug when I import an ES module (that also expose a cjs version) with default export, svelte-kit fails when building (static adapter) It works fine on dev
Logs
TypeError: WalletStores is not a function
at file:///home/wighawag/dev/wighawag/templates/jolly-roger/web/.svelte-kit/output/server/app.js:1055:22
at ModuleJob.run (internal/modules/esm/module_job.js:152:23)
at async Loader.import (internal/modules/esm/loader.js:166:24)
at async prerender (file:///home/wighawag/dev/wighawag/templates/jolly-roger/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.109_svelte@3.38.2/node_modules/@sveltejs/kit/dist/chunks/index5.js:79:14)
at async Object.prerender (file:///home/wighawag/dev/wighawag/templates/jolly-roger/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.109_svelte@3.38.2/node_modules/@sveltejs/kit/dist/chunks/index5.js:296:5)
at async adapt (file:///home/wighawag/dev/wighawag/templates/jolly-roger/node_modules/.pnpm/sveltejs-adapter-ipfs@0.1.4/node_modules/sveltejs-adapter-ipfs/index.js:21:4)
at async adapt (file:///home/wighawag/dev/wighawag/templates/jolly-roger/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.109_svelte@3.38.2/node_modules/@sveltejs/kit/dist/chunks/index5.js:322:2)
at async file:///home/wighawag/dev/wighawag/templates/jolly-roger/node_modules/.pnpm/@sveltejs+kit@1.0.0-next.109_svelte@3.38.2/node_modules/@sveltejs/kit/dist/cli.js:616:5
To Reproduce
git clone https://github.com/wighawag/jolly-roger.git
cd jolly-roger
git checkout sveltekit-bug-default-import
pnpm i
pnpm web:build staging
Information about your SvelteKit Installation:
Diagnostics
- The output of
npx envinfo --system --npmPackages svelte,@sveltejs/kit,vite --binaries --browsers
System:
OS: Linux 5.11 Ubuntu 21.04 (Hirsute Hippo)
CPU: (8) x64 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz
Memory: 3.81 GB / 15.43 GB
Container: Yes
Shell: 5.8 - /usr/bin/zsh
Binaries:
Node: 14.16.1 - ~/.volta/tools/image/node/14.16.1/bin/node
Yarn: 1.22.10 - ~/.volta/tools/image/yarn/1.22.10/bin/yarn
npm: 6.14.12 - ~/.volta/tools/image/node/14.16.1/bin/npm
Browsers:
Chrome: 90.0.4430.93
Firefox: 88.0.1
npmPackages:
svelte: ^3.38.2 => 3.38.2
- Your browser
Chrome: 90.0.4430.93
- Your adapter (e.g. Node, static, Vercel, Begin, etc…)
Severity While I can get around it via this line : https://github.com/wighawag/jolly-roger/blob/82b113f47043e11b9532a3527462ec17c67c6fca/web/src/lib/stores/wallet.ts#L13 I consider the issue critical as svelte-kit/vite is supposed to work with ES module natively.
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Comments: 15 (15 by maintainers)
ha, I thought about that but did not try. I actually worked around the issue by export a named field instead of using the default export.
Yes, if adapter-static/node uses the esm export, then it should work as usual.
I think I know why you’re getting
Cannot use import statement outside a module. You’re exporting the ESM files in.js. For commonjs projects (web3w), you need to export them as.mjs.That’s strange indeed. I’ve encountered similar situations too but never understood why.
Yeah I’d agree with that. Currently,
adapter-staticseems to be the only adapter that runs in nodejs without a bundler. so nodejs limitations apply at that point. But I think it’s fair too for SvelteKit to push usage of exports map. Otherwise, a workaround of:should work too since you can import CJS in ESM.
Does the
Cannot use import statement outside a moduleerror happen in the SvelteKit app, or the web3w package build? That happens when you use theimportkeyword in non-ESM environments, which I can’t think of an instance where this could happen.Ideally it shouldn’t. I’ve faced few such issues when working with SvelteKit.
But I when digging around, I found out this might be an issue with nodejs module handling and not sveltekit/vite.
@sidharthv96 I am actually the author of the library that pose problem and I am going to implement your proposal but I see it as a workaround,
Svelte-kit/ vite should not require this changes, right ?