"The CJS build of Vite's Node API is deprecated" when using a TS vite.config.ts and the package.json has no type

[xaviergonz]

Describe the bug

I just updated to vite 5 and I am using a vite.config.ts file, but when compiling the following shows in the console:

The CJS build of Vite's Node API is deprecated

In this case the package.json has no "type": "module" set. If that's is there the warning does not appear.

If I'm not mistaken, Vite is the one that internally compiles that file from TS into CJS instead of ESM, or is there something I need to do to make that happen without having to set the type of the whole package to module?

Reproduction

https://stackblitz.com/edit/vitejs-vite-kn2wsz?file=package.json&view=editor

Steps to reproduce

npm install
npm run build

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.18.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.4.2 - /usr/local/bin/npm
    pnpm: 8.9.2 - /usr/local/bin/pnpm
  npmPackages:
    vite: ^5.0.0 => 5.0.0

Used Package Manager

npm

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.

[xaviergonz]

PD: I just noticed that if I rename the file to vite.config.mts the error goes away

[ghiscoding]

That is mentioned in Deprecate CJS Node API

In a basic Vite project, make sure:

The vite.config.js file content is using the ESM syntax.
The closest package.json file has "type": "module", or use the .mjs extension, e.g. vite.config.mjs.

There's more info to read about, the link above is also available in the console warning if I remember correctly

[xaviergonz]

I read it and while it does mention js and mjs, it doesn't say anything specific about ts / mts

[bluwy]

We can add a note about ts variants. I'll send a PR for it. But yes, you need vite.config.mts in this case. If you use .ts and no type: "module", it implies the runtime is CJS so Vite compiles to CJS instead.