Stabilizing --config-loader=runner / --config-loader=native

[sapphi-red]

--config-loader=runner

• Added as experimental in vite@6.1.0
• Original PR by @sheremet-va

--config-loader=native

• Added as exprimental in vite@6.1.0
• Original PR by @bluwy

---

Current limitations of each options

• --config-loader=bundle (default) (uses esbuild to bundle the config and execute that bundled file)
  • the bundled file is written to disk
    • There will be temporary vite.config.js.timestamp files that have not been cleaned up #13267
    • avoid writing the temporary file when evaluating the config file #9470
    • Cannot start Vite 6 due to .vite-temp directory creation in node_modules #18839
    • vite 6 breaks deno support when npm: specifer is used in config file #18822
    • docs(config): add vscode debug error tip #19631
    • this can be solved by loading via data URL (fix: load esm vite config without a temporary file #17894)
  • __dirname / dynamic import may work differently when it's not statically analyzable
    • to avoid this happening, we externalize the dependencies: vite.config.ts can't import untranspiled ts files from other packages in the same monorepo #5370, fix: avoid externalizing plugins that resolve to local files in monorepos #17323
  • doesn't respect --conditions (Respect conditions arg from node #11838)
    • Add a way to get the enabled conditions nodejs/node#55824, module: add module.customConditions nodejs/node#57688
  • behaves slightly different from normal Node.js (can be seen as a feature though)
• --config-loader=runner (uses module runner, it will transform the files on-demand)
  • can support ESM configs that doesn't have .mjs or type=module
  • deferred dynamic imports does not work (feat: use module runner to import the config #18637 (comment))
  • doesn't respect --conditions (Respect conditions arg from node #11838)
    • Add a way to get the enabled conditions nodejs/node#55824, module: add module.customConditions nodejs/node#57688
  • behaves slightly different from normal Node.js (can be seen as a feature though)
• --config-loader=native (uses dynamic import, it will use the transform supported by the runtime or the registered Node.js loaders)
  • cannot support ESM configs that doesn't have .mjs or type=module (will be unblocked by syntax detection?)
  • does not support server restart when imported modules are changed
    • For Node.js, this can be solved by a loader (feat: track dependencies when loading config with native #19374)

---

We're creating this discussion to gather feedback about this feature, so we can later use it while moving it out of experimental. We are also considering which config loader should be the default. Also we may remove the non-default ones.

[hi-ogawa]

Nice write up! Probably also worth mentioning debugger usage. bundle loader's node_modules temp file is ignored by vscode by default #19631. From my testing, both runner and native work with debugger. It looks like using NODE_OPTIONS=... in vscode debug terminal behaves oddly, so I needed to run cli by node --experimental-strip-types ./node_modules/vite/bin/vite.js --config-runner=native.

[roman-petrov]

Just an idea: what about implementing another --config-loader=tsx using tsx API?

I think it might be relatively easy and tsx doesn't have dynamic import limitations... I works quite well in our projects, we just create vite.config.js which imports our (relatively complex) TypeScript configurations like this:

import { tsImport } from "tsx/esm/api";

export default (await tsImport(`./vite.config.ts`, import.meta.url)).default;

[sapphi-red]

That would have the same behavior with NODE_OPTIONS='--import tsx' vite --config-loader=native.

[roman-petrov]

As I understand running vite with --import tsx node options will make all imports go through tsx, not only configuration file imports. This works almost perfectly but can cause issues like #19182