Import error "cannot find module"

[moritzebeling]

Hi, when I try to import your module

import { scrollTo, scrollIntoView } from 'scroll-js';

I get the following error:

Cannot find module core-js/modules/es.object.to-string.js imported from ./node_modules/scroll-js/dist/scroll.common.js

I have no idea what this could mean... Any idea how I could get this to work? Thank you in advance.

PS: I am using Vite with SvelteKit if that‘s of any help

[markcellus]

Thanks for filing issue! I'll need a little more information if that's okay: what's your Node version? Is your project a CommonJS module or ES module?

[moritzebeling]

Hey, thank you for taking the time and looking into it! I’m taking the ES route and tested various node versions between 16.15.x and 18.4.x all throwing the same error.

The full error report looks like:

Cannot find module 'core-js/modules/es.object.to-string.js' imported from '[...]/node_modules/scroll-js/dist/scroll.common.js'
Error: Cannot find module 'core-js/modules/es.object.to-string.js' imported from '[...]/node_modules/scroll-js/dist/scroll.common.js'
    at viteResolve ([...]/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:50310:25)
    at Function.<anonymous> ([...]/node_modules/vite/dist/node/chunks/dep-8f5c9290.js:50327:28)
    at Module._load (node:internal/modules/cjs/loader:787:27)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at [...]/node_modules/scroll-js/dist/scroll.common.js:10:83
    at Object.<anonymous> ([...]/node_modules/scroll-js/dist/scroll.common.js:13:3)
    at Module._compile (node:internal/modules/cjs/loader:1112:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1166:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)

I am absolutely not sure, it can totally be a problem on my side, but yet again I did nothing more than importing the module... Are there any requirements?

[markcellus]

Hmm I'm not too familiar with how Vite resolves modules. But it looks like Vite is attempting to build scroll-js as a CommonJS module instead of ES module. scroll-js exposes multiple dist files that can be used, depending on how your project is set up.

See main and module fields here. If your project is an ES module, Vite should be resolving to the dist/scroll.js file in the module field instead of the dist/scroll.common.js file in the main field. (common.js extension just means it's meant for a CommonJS project)

Does that help at all? If not, I can try to pull Vite down and import it to see if I can reproduce.

[markcellus]

Hey @moritzebeling just checking in. Hopefully you found a resolution for your issue. I'll leave this open for a few more days. If I don't hear back from you, I'll assume all is well and close issue. Thanks again for your contributions!

[moritzebeling]

Hey Mark, thank you very much for checking back in. I was trying out several other plugins and now wanted to try yours once again because it seems to be one of the very few that support SSR and duration control :)

I tried with the "type": "module" and several Vite options but couldn’t solve the error.

When trying to import directly from the source file scroll-js/dist/scroll.js it said unexpected keyword "export", which I found very weird.

I then copied the file dist/scroll.js from the node_modules folder into my project and now import directly and funnily enough it now works:

import { scrollTo } from './scroll.js';

Unfortunately I don’t know enough about Vite, Rollup or CommonJS to really pinpoint how this could be resolved. It really only seems to be a configuration issue.

And I also know that this is not the idea of open source modules, but I will now use is as a temporary workaround. Thank you!