importing .mts file in config requires extension

[wmertens]

Describe the bug

I'm using .mts for the vite config so I can use ESM plugins.

WHen I make a second config that imports the first, I need to add the .mts or it will not find it, and TS will complain and I have to add "allowImportingTsExtensions": true to tsconfig, which can't always be done.

Reproduction

https://github.com/QwikDev/qwik/blob/62cfd05cb20785e396a262648479df1a99d34b53/packages/docs/adapters/cloudflare-pages/vite.config.mts#L3-L4

Steps to reproduce

No response

System Info

System:
    OS: Linux 6.11 NixOS 24.11 (Vicuna) 24.11 (Vicuna)
    CPU: (16) x64 AMD Ryzen 7 7840HS with Radeon 780M Graphics
    Memory: 2.48 GB / 13.34 GB
    Container: Yes
    Shell: 5.2.32 - /run/current-system/sw/bin/bash
  Binaries:
    Node: 20.17.0 - /nix/store/dcdc33kdjdhjnzg6rkmd0cx4kpwl8cac-nodejs-20.17.0/bin/node
    npm: 10.8.2 - /nix/store/dcdc33kdjdhjnzg6rkmd0cx4kpwl8cac-nodejs-20.17.0/bin/npm
    pnpm: 9.1.2 - /nix/store/qsnvrzbi9dcrg6kfl4srjgg8jp613cxf-corepack-nodejs-20.17.0/bin/pnpm
  npmPackages:
    vite: 5.4.10 => 5.4.10

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[hi-ogawa]

Trying to make a standalone repro, do you see something like this without .mts? https://stackblitz.com/edit/sb1-crj2kw?file=vite.config.mts

✘ [ERROR] Could not resolve "./vite.other.config"

    vite.config.mts:2:7:
      2 │ import './vite.other.config';
        ╵        ~~~~~~~~~~~~~~~~~~~~~

failed to load config from /home/projects/sb1-crj2kw/vite.config.mts

This behavior is from esbuild, but it looks like we can technically change it from --resolve-extension https://esbuild.github.io/api/#resolve-extensions I'm not sure if there's any down side to this. It sounds fine to copy something similar to Vite's own resolution https://vite.dev/config/shared-options.html#resolve-extensions

[hi-ogawa]

Investigating this further, I'm not sure typescript supports extension-less import of .mts.

@wmertens Can you elaborate what you wish to do in your packages/docs/adapters/cloudflare-pages/vite.config.mts? From what I tested, tsc would complain if you do import baseConfig from '../../vite.config' there, so Vite supporting this doesn't seem to help DX in this particular case at least.

Using import "./vite.config.mjs" instead seems to work fine for both tsc and vite https://stackblitz.com/edit/sb1-5yfmin?file=vite.config.mts

[sapphi-red]

@hi-ogawa Probably your stackblitz link is private, it shows a 404 for me.

[hi-ogawa]

Ah, sorry. I started to let bolt.new create repro, but just realized it defaults to private one 🤦 I made all repros public now.

[wmertens]

@hi-ogawa yes that's the error I'm seeing. Note that I'm using the Bundler resolving for TS, so in the editor it's fine to import extensionless.

Yes I think making vite call esbuild with the appropriate flags for mts resolution would be great.

[hi-ogawa]

Note that I'm using the Bundler resolving for TS, so in the editor it's fine to import extensionless.

I couldn't make that work though. I tested on qwik repo using import baseConfig from '../../vite.config' there and my vscode tsc is complaining the same like this:

Can you explain more how you're making extensionless mts work?

[wmertens]

@hi-ogawa oh sorry I didn't realize that. I opened microsoft/TypeScript#60409 to handle that.

In any case, telling esbuild about .mts makes it read vite.config.mts directly, instead of first having to transpile, right? Because that leaves these ....timestamp...ts files around, and eslint does not like that, breaking builds sometimes.

[sapphi-red]

I think we can add this when TypeScript adds the support. I don't think it make sense to support this unless TypeScript supports it.

Because that leaves these ....timestamp...ts files around, and eslint does not like that, breaking builds sometimes.

I don't think that is related to this issue. The behavior around that won't change even if importing .mts without extension works. On that end, #18509 should help (it'll be released in Vite 6).