error TS2835 suggests `.js` extension when `rewriteRelativeImportExtensions` is enabled

🔎 Search Terms

• error TS2835
• rewriteRelativeImportExtensions
• allowImportingTsExtensions
• tsconfig
• diagnostics

🕗 Version & Regression Information

• This changed between versions: N/A and 5.7.2
• This changed in commit or PR: N/A
• This is the behavior in every version I tried, and I reviewed the FAQ for entries about: rewriting extensions
• I was unable to test this on prior versions because: the feature didn't exist yet

⏯ Playground Link

Playground does not support multiple files to demonstrate the diagnostic

💻 Code

//@filename src/foo.ts

export const foo = "foo"

//@filename src/bar.ts

import { foo } from './foo'

And in tsconfig:

// compiler options
    "moduleResolution": "nodenext",
    "allowImportingTsExtensions": true,
    "rewriteRelativeImportExtensions": true,

Though here is my full tsconfig just in case:

{
  "compilerOptions": {
    // Enable latest features
    "lib": [
      "ESNext",
      "DOM"
    ],
    "target": "ESNext",
    "module": "NodeNext",
    "moduleDetection": "force",
    "jsx": "react-jsx",
    "allowJs": false,

    "moduleResolution": "nodenext",
    "allowImportingTsExtensions": true,
    "rewriteRelativeImportExtensions": true,
    "verbatimModuleSyntax": true,
    "noEmit": true,
    // Best practices
    "strict": true,
    "skipLibCheck": true,
    "noFallthroughCasesInSwitch": true,
    // Some stricter flags (disabled by default)
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "noPropertyAccessFromIndexSignature": false,
    // Awesome bundling
    "isolatedDeclarations": true,
    "composite": true
  }
}

🙁 Actual behavior

src/bar.ts:1:21 - error TS2835: Relative import paths need explicit file extensions in ECMAScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean './foo.js'?

1 import { foo } from "./foo";

The diagnostic suggests a file extension ending in .js, even when both allowImportingTsExtensions and rewriteRelativeImportExtensions are enabled.

🙂 Expected behavior

src/bar.ts:1:21 - error TS2835: Relative import paths need explicit file extensions in ECMAScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean './foo.ts'?

1 import { foo } from "./foo";

The suggested import path should probably be .ts when these options are enabled.

Assuming I had rewriteRelativeImportExtensions: false, and given my above settings which is not using bundler mode, it would make sense to suggest .js. However, because rewrite is enabled, I think the best option would be to suggest .ts.

It also seems like tsserver should be able to offer an intellisense fix here in general, but I'm not sure, and that's a bit unrelated.

Additional information about the issue

Additionally, the wiki faq seems slightly outdated now with the addition of rewriteRelativeImportExtensions. It currently says the following:

### Module Specifier Rewriting
It's explicitly out of scope for TypeScript to modify module specifiers as they appear in emitted JS, e.g [...]

[...] This includes things like changing file extensions

Commencez par suivre le diagnostic TS2835 et par déterminer comment moduleResolution, allowImportingTsExtensions et rewriteRelativeImportExtensions influencent le chemin suggéré. Reproduisez ensuite l’exemple à deux fichiers src/foo.ts et src/bar.ts avec la tsconfig fournie, puis vérifiez que le diagnostic suggère .ts lorsque la réécriture est activée, tout en conservant sinon la suggestion .js existante.