Fails with Invalid loader value: "mjs" (CDK ESM module)

[kristiandreher]

I am using the @graphql-tools packages to manage the Appsync schema in my application. When running lld I get the following error message:

> yarn lld -v                                                     
yarn run v1.22.22
warning package.json: No license field
$ /<project-root>/node_modules/.bin/lld -v
Welcome to Lambda Live Debugger 🐞 version 1.2.2.
Parameters: 
 - context=undefined
 - interval=3000
 - verbose=true
 - debuggerId=80edea8f7b5fa224fdc38915ba29a40c
 - start=true
NPM module folder: /<project-root>/node_modules/lambda-live-debugger/dist
Project folder: /<project-root>
Starting the debugger (ID 80edea8f7b5fa224fdc38915ba29a40c)...
Getting resources with 'cdk' framework
[CDK] Entry file: /<project-root>/bin/esm-test-app.ts
[CDK] Using ESM format
✘ [ERROR] Invalid loader value: "mjs" [plugin injectCode]

    node_modules/@graphql-tools/load-files/esm/index.js:14:22:
      14 │ import { parse } from 'graphql';
         ╵                       ~~~~~~~~~

Error: Error building CDK code: Build failed with 1 error:
node_modules/@graphql-tools/load-files/esm/index.js:14:22: ERROR: [plugin: injectCode] Invalid loader value: "mjs"
    at CdkFramework.getLambdasDataFromCdkByCompilingAndRunning (file:///<project-root>/node_modules/lambda-live-debugger/dist/frameworks/cdkFramework.mjs:284:19)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async CdkFramework.getLambdas (file:///<project-root>/node_modules/lambda-live-debugger/dist/frameworks/cdkFramework.mjs:51:30)
    at async Object.getLambdas (file:///<project-root>/node_modules/lambda-live-debugger/dist/resourceDiscovery.mjs:43:21)
    at async Object.discoverLambdas (file:///<project-root>/node_modules/lambda-live-debugger/dist/configuration.mjs:115:26)
    at async run (file:///<project-root>/node_modules/lambda-live-debugger/dist/lldebugger.mjs:54:5) {
  [cause]: Error: Build failed with 1 error:
  node_modules/@graphql-tools/load-files/esm/index.js:14:22: ERROR: [plugin: injectCode] Invalid loader value: "mjs"
      at failureErrorWithLog (/<project-root>/node_modules/esbuild/lib/main.js:1651:15)
      at /<project-root>/node_modules/esbuild/lib/main.js:1059:25
      at runOnEndCallbacks (/<project-root>/node_modules/esbuild/lib/main.js:1486:45)
      at buildResponseToResult (/<project-root>/node_modules/esbuild/lib/main.js:1057:7)
      at /<project-root>/node_modules/esbuild/lib/main.js:1086:16
      at responseCallbacks.<computed> (/<project-root>/node_modules/esbuild/lib/main.js:704:9)
      at handleIncomingPacket (/<project-root>/node_modules/esbuild/lib/main.js:764:9)
      at Socket.readFromStdout (/<project-root>/node_modules/esbuild/lib/main.js:680:7)
      at Socket.emit (node:events:519:28)
      at addChunk (node:internal/streams/readable:559:12) {
    errors: [Getter/Setter],
    warnings: [Getter/Setter]
  }
}
Done in 1.43s.

esm-test-app-stack.ts:

import { loadFilesSync } from "@graphql-tools/load-files";
import { Duration, Stack, type StackProps } from "aws-cdk-lib";
import { Construct } from "constructs";
import * as url from "url";
import { resolve } from "path";
import { NodejsFunction, OutputFormat } from "aws-cdk-lib/aws-lambda-nodejs";
import { Runtime } from "aws-cdk-lib/aws-lambda";
import { join } from "path";

const __dirname = url.fileURLToPath(new URL(".", import.meta.url));

export class EsmTestAppStack extends Stack {
  constructor(scope: Construct, id: string, props?: StackProps) {
    super(scope, id, props);

    const schemas = loadFilesSync<string>(join(__dirname, "../schemas"));

    new NodejsFunction(this, "Lambda", {
      timeout: Duration.seconds(20),
      memorySize: 1024,
      runtime: Runtime.NODEJS_20_X,
      entry: resolve(__dirname, "./handler.ts"),
      environment: {
        NODE_OPTIONS: "--enable-source-maps",
        LOG_LEVEL: "DEBUG",
      },
      bundling: {
        minify: true,
        sourceMap: true,
        externalModules: [],
        platform: "node",
        // ESM important properties:
        mainFields: ["module", "main"],
        format: OutputFormat.ESM,
        banner:
          "const require = (await import('node:module')).createRequire(import.meta.url);",
      },
    });
  }
}

package.json

{
  "name": "esm-test-app",
  "version": "0.1.0",
  "type": "module",
  "scripts": {
    "build": "tsc"
  },
  "devDependencies": {
    "@graphql-tools/load-files": "^7.0.0",
    "@types/node": "20.14.9",
    "aws-cdk": "2.152.0",
    "graphql": "^16.9.0",
    "lambda-live-debugger": "^1.2.2",
    "tsx": "^4.17.0",
    "typescript": "~5.5.3"
  },
  "dependencies": {
    "aws-cdk-lib": "2.152.0",
    "constructs": "^10.0.0"
  }
}

[ServerlessLife]

Thank you, @kristiandreher, for reporting the issues.

I will take a careful look into this because others could have a similar problem.

Could you share a sample Lambda handler or part of it? Of course, a sample project would be even better.

[kristiandreher]

Thanks a lot for looking into the issue!

The problem is not in the Lambda handler. The problem is in the CDK stack. I have included the stack code in the issue. Let me know if you need more details.

[ServerlessLife]

Aha. I misunderstood. Thank you for clarifying.

I will try to reproduce and fix it over the weekend.

[kristiandreher]

Awesome!

[kristiandreher]

I did some more tests and now I get a different error. (I think I had an old .lldebugger folder when reporting the issue above). When removing the .lldebugger folder I get the following error.

> yarn lld -v                                                                                                             
yarn run v1.22.22
warning package.json: No license field
$ /<project-root>/node_modules/.bin/lld -v
Welcome to Lambda Live Debugger 🐞 version 1.2.2.
Error: Cannot find package '/<project-root>/node_modules/lambda-live-debugger/package.json' imported from /<project-root>/.lldebugger/configCompiled.mjs
    at legacyMainResolve (node:internal/modules/esm/resolve:215:26)
    at packageResolve (node:internal/modules/esm/resolve:841:14)
    at moduleResolve (node:internal/modules/esm/resolve:927:18)
    at defaultResolve (node:internal/modules/esm/resolve:1169:11)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:383:12)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:352:25)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:227:38)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:87:39)
    at link (node:internal/modules/esm/module_job:86:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}
Done in 0.69s.

Sorry for the confusion.

Using node v20.16.0