Query builder: TypeScript with ESM not working properly

[cojomchi]

I am using Node 16 + ESM + Strictest for my tsconfig.json

{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Node 16 + ESM + Strictest",
  "compilerOptions": {
    "lib": [
      "es2021"
    ],
    "module": "es2022",
    "target": "es2021",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "allowUnusedLabels": false,
    "allowUnreachableCode": false,
    "exactOptionalPropertyTypes": true,
    "noFallthroughCasesInSwitch": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noPropertyAccessFromIndexSignature": true,
    "noUncheckedIndexedAccess": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "importsNotUsedAsValues": "error",
    "checkJs": true
  }
}

Please note that I am not using NodeNext for "module" because some libraries are not supported properly (I am using Fastify). And I also have set "type": "module" on package.json

In this situation, --target ts option does not work with following error:

 Cannot find module 'src/querybuilder/syntax/external' imported from src/querybuilder/index.ts

Which is because the import statement does not include .js extension in index.ts

export * from "./syntax/external";

To make this work, I have to modify all import statement to include .js extension.

Another workaround is using --target cjs and rename index.mjs to index.js so that it can be properly imported from ts file.

[BD103]

I found this issue while using Nuxt 3's build command with Vite. The workaround that I used was adding --target esm to the generation arguments. I need to do further testing to see how this affects the program.

I would be willing to create a reproducible example program, if requested.

Edit:

Turns out that building with --target ts works exclusively when using the Nuxt dev server (nuxt dev), while building with --target esm works exclusively when building for production (nuxt build).

[scotttrinh]

This issue is becoming more prominent with the advent of Node v20, so I agree we should reconfigure the module work to get compatibility with all of the current LTS versions of Node plus Deno.

[emmanuelbuah]

Any idea when this might be addressed? I'm kinda blocked on my project unless I keep editing the import extensions on every code generation which is extremely time consuming.

[scotttrinh]

@emmanuelbuah

Any idea when this might be addressed? I'm kinda blocked on my project unless I keep editing the import extensions on every code generation which is extremely time consuming.

Nothing to share as far as timeline is concerned here. Does the target-based-on-env workaround work for your use case? If not, can you share a little about your setup (build tooling, framework, etc) that makes it unique?

[emmanuelbuah]

@scotttrinh I found a workaround for the problem by using --target ts. However, I had to modify my tsconfig file and set the moduleResolution option from "nodenext" (esm) to "node". This works for me because I have a mono repo where I can configure the resolution for each package separately. But I understand that this might not be feasible for some situations where you don't have that flexibility.

For your information, I'm using Nx to manage and build my mono repo, and node + react + graphql + flutter as my frameworks. So nothing too unusual (I think). Oh, its also a refactor from prisma to edgedb.

[KaelWD]

I'm using tsup to build, the generated code is ok because it's bundled but if I want to keep edgedb itself separate I have to add exports to its package.json:

"exports": {
  ".": "./dist/index.node.js",
  "./dist/*": "./dist/*.js"
},