question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Directory import not supported in build mode

See original GitHub issue

Describe the bug

The problem consist in import from folders only containing a package.json file, whose attribute main, module, types are pointing somewhere else, while running in build mode.

I’m sorry that the issue is coming from another framework, unfortunately I’m not much familiar with direct use of Vite, but I’m pretty sure the issue is related to build tools, so it’s not specific to the framework. I was unsure if it’s coming from Rollup, or whatever is underlying Vite, but I guess you can help redirect if appropriate.

The full story is the following:

  • I was making a project with SvelteKit
  • I tried using rxdb
  • I already experienced some issues, because of mix between node on browser js
    • e.g. I had to deal with issues like missing events
    • the final workaround have been to add shims for process (window.process = window.process || {};) and global (window.global = window;), and to make a custom build, adding all RxPlugin and PouchPlugin inside onMount, in order to do it only inside the browser
  • then, the imports looked like:
    import { createRxDatabase, addRxPlugin } from 'rxdb/plugins/core'; 
    
    and everything was working with svelte-kit dev
  • as soon as I tried to use svelte-kit build, then I obtained the error message provided in the logs (for one of the imports, it happens for all of them)
  • actually the reason is that the import path is pointing to a folder only containing a package.json file like the following: https://github.com/pubkey/rxdb/blob/e5731c6953410c02aa66cbab5ac5e44d433b3a58/plugins/core/package.json#L1-L8 containing attributes main, jsnext:main, modules, types that are pointing to other files
  • the workaround found at the moment is to change the import as suggested:
    import { createRxDatabase, addRxPlugin } from 'rxdb/dist/lib/core.js';
    
    but this way there is non package.json associated, and, e.g., types are completely lost (so typescript hints cannot be used, and the editor complaints it can’t find declaration file)

This behavior is clearly connect with build and bundling, and so I resorted to looking into Vite. Moreover, it’s different between svelte-kit dev and svelte-kit build, and since svelte-kit is not a build tool on its own, but it’s said to rely on Vite, I guess the issue is connected do Vite.

Hope you can help to use the first version of the input, or redirect to the relevant place.

Reproduction

  • make a new project (I used SvelteKit, but don’t believe to be relevant)
  • install rxdb
  • make a custom build, following intructions
  • run in build mode

System Info

System:
    OS: Linux 5.13 Ubuntu 21.10 21.10 (Impish Indri)
    CPU: (4) x64 Intel(R) Core(TM) i5-6267U CPU @ 2.90GHz
    Memory: 494.57 MB / 7.56 GB
    Container: Yes
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 14.18.1 - /usr/bin/node
    Yarn: 1.22.15 - /usr/bin/yarn
    npm: 6.14.15 - /usr/bin/npm
  Browsers:
    Brave Browser: 95.1.31.91
    Firefox: 95.0

Used Package Manager

pnpm

Logs

Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '<project>/node_modules/rxdb/plugins/core' is not supported resolving ES modules imported from <project>/.svelte-kit/output/server/chunks/index-92d6ff96.js
Did you mean to import rxdb@10.5.4_rxjs@7.4.0/node_modules/rxdb/dist/lib/core.js?
    at new NodeError (internal/errors.js:322:7)
    at finalizeResolution (internal/modules/esm/resolve.js:304:17)
    at moduleResolve (internal/modules/esm/resolve.js:731:10)
    at Loader.defaultResolve [as _resolve] (internal/modules/esm/resolve.js:842:11)
    at Loader.resolve (internal/modules/esm/loader.js:89:40)
    at Loader.getModuleJob (internal/modules/esm/loader.js:242:28)
    at ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:76:40)
    at link (internal/modules/esm/module_job.js:75:36)

Validations

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:20 (11 by maintainers)

github_iconTop GitHub Comments

2reactions
sodateacommented, Dec 23, 2021

😂 Sorry, I just figured out the exact problem of the other issue. It’s due to a dot in the directory path. So I think the two issues are not related.

1reaction
bluwycommented, Dec 23, 2021

No problem 😃 I think the issue might reside in Rollup or Vite of the generated SSR bundle code. But Kit is working as usual here as it’s basing off the generated bundle, so no need for an issue there.

Read more comments on GitHub >

github_iconTop Results From Across the Web

'Directory import is not supported resolving ES modules' with ...
With ES6 modules you can not (yet?) import directories. Your import should look like this: import database from "./database/index.js".
Read more >
Error [ERR_UNSUPPORTED_DIR_IMPORT] in Node.js
The "Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import is not supported" occurs in Node.js, when we try to use a directory import. To solve the error, ......
Read more >
Troubleshooting VM Import/Export - AWS Documentation
When importing or exporting a virtual machine (VM), most errors occur because of an attempt to do something that isn't supported. To avoid...
Read more >
Using ES modules in Node.js - LogRocket Blog
With ES modules, modules are defined with the use of the import and export keywords instead of the require() function in CommonJS.
Read more >
build - Hello wasm-pack!
By default, wasm-pack will generate a directory for it's build output called pkg . ... straight to cargo build even if they are...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found