Module resolution: Named imports not supported with import attributes

[mdmower]

Demo Repo

https://github.com/mdmower/with-json-tsc

See bottom of post for information.

Which of the following problems are you reporting?

The module specifier resolves at build time, but not at run time

Demonstrate the defect described above with a code sample.

import {compilerOptions} from './tsconfig.json' with {type: 'json'};

Run tsc --showConfig and paste its output here

{
    "compilerOptions": {
        "target": "es2023",
        "lib": [
            "es2023"
        ],
        "module": "nodenext",
        "moduleResolution": "nodenext",
        "resolveJsonModule": true,
        "strict": true,
        "moduleDetection": "force",
        "esModuleInterop": true,
        "allowSyntheticDefaultImports": true,
        "resolvePackageJsonExports": true,
        "resolvePackageJsonImports": true,
        "useDefineForClassFields": true,
        "noImplicitAny": true,
        "noImplicitThis": true,
        "strictNullChecks": true,
        "strictFunctionTypes": true,
        "strictBindCallApply": true,
        "strictPropertyInitialization": true,
        "alwaysStrict": true,
        "useUnknownInCatchVariables": true
    },
    "files": [
        "./index.ts"
    ]
}

Run tsc --traceResolution and paste its output here

Found 'package.json' at 'C:/Users/matt.mower/source/with-json-tsc/package.json'.

There was an error creating your Issue: body is too long, body is too long (maximum is 65536 characters).

Paste the package.json of the importing module, if it exists

{
  "type": "module",
  "scripts": {
    "build": "tsc",
    "start": "node index.js"
  },
  "devDependencies": {
    "@types/node": "^22",
    "typescript": "^5.5"
  }
}

Paste the package.json of the target module, if it exists

N/A

Any other comments can go here

TypeScript 5.3 added support for import attributes. tsc does not warn or error when attempting to use named imports for these kinds of imports. When named imports are used, they are preserved in the produced .js and there is no environment where they are supported.

For example, in the linked demo repository:

import {compilerOptions} from './tsconfig.json' with {type: 'json'};
console.log(compilerOptions);

compiles to:

import { compilerOptions } from './tsconfig.json' with { type: 'json' };
console.log(compilerOptions);

which does not run in Node.js 22 or Chrome 127.

Given that --resolveJsonModule has historically allowed named imports and produces valid CommonJS, it's likely that developers will assume TypeScript can handle named imports when using import attributes as well.

For example, if the linked demo repository is set to output CommonJS instead of ESM, then:

import {compilerOptions} from "./tsconfig.json";
console.log(compilerOptions);

compiles to:

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tsconfig_json_1 = require("./tsconfig.json");
console.log(tsconfig_json_1.compilerOptions);

It seems that TypeScript should disallow named imports when import attributes are used, or should compile so that a default import is used, similar to handling in CommonJS.

[jcalz]

NB: I'm not a module expert. I'd assume import attributes are not the issue here since TS is intentionally agnostic to them. But if you're using esm and importing a json module, I'd think #46434 would warn on named imports. That doesn't seem to be happening; why not?