Description

With Typescript version 4.7, Typescript now has the option to preserve "ES Modules" if tsconfig.json specifies:

{
  "compilerOptions": {
    "module": "Node16"
  }
}

This is a step forward in supporting native ESM in Node from Typescript's direction, but it comes with the requirement that all typescript modules when imported use the .js extension.

Ref: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-4-7.html

This works all fine and well in Vite when importing typescript modules in .ts-files.

The problems begin when importing .ts-files in .js, .vue, .svelte, and so on.

E.g.

// ./some-ts-file.ts
export const hello = "Hello";

// ./my-app.js
import { hello } from "./some-ts-file.js"

See reproducible example: https://github.com/aMediocreDad/vite-import-ts-as-js

Suggested solution

The expectation is that importing .ts-files as .js resolves the file like it does in .ts-files at the moment (See related "Closed" issue: #3040).

Alternative

No response

Additional context

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.