Skip to content

error TS2835 suggests .js extension when rewriteRelativeImportExtensions is enabled #60926

Open
@johnpyp

Description

@johnpyp

🔎 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

Metadata

Metadata

Assignees

No one assigned

    Labels

    Awaiting More FeedbackThis means we'd like to hear from more people who would be helped by this featureSuggestionAn idea for TypeScript

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions