Skip to content

.cts files are not transpiled by esbuild plugin in SSR mode #21322

@u1f992

Description

@u1f992

Describe the bug

When dynamically importing a .cts file containing TypeScript-specific syntax in SSR mode, Vite fails to transpile it with esbuild and passes it directly to Rollup, causing a parse error.

The issue is in packages/vite/src/node/plugins/esbuild.ts:

The esbuildPlugin filter:

const filter = createFilter(include || /\.(m?ts|[jt]sx)$/, exclude || /\.js$/)

This regex /\.(m?ts|[jt]sx)$/ matches .ts, .mts, .tsx, .jsx but not .cts.

However, transformWithEsbuild already handles .cts correctly:

if (ext === 'cjs' || ext === 'mjs') {
  loader = 'js'
} else if (ext === 'cts' || ext === 'mts') {
  loader = 'ts'
}

Suggested fix:

- const filter = createFilter(include || /\.(m?ts|[jt]sx)$/, exclude || /\.js$/)
+ const filter = createFilter(include || /\.([cm]?ts|[jt]sx)$/, exclude || /\.js$/)

Reproduction

https://github.com/u1f992/vite-cts-repro

Steps to reproduce

npm install
npm test

System Info

System:
    OS: Linux 6.14 Ubuntu 24.04.3 LTS 24.04.3 LTS (Noble Numbat)
    CPU: (14) x64 Intel(R) Core(TM) Ultra 7 155U
    Memory: 22.07 GB / 30.86 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
  Binaries:
    Node: 22.20.0 - /run/user/1000/fnm_multishells/783550_1766368436272/bin/node
    Yarn: 1.22.22 - /run/user/1000/fnm_multishells/783550_1766368436272/bin/yarn
    npm: 11.6.2 - /run/user/1000/fnm_multishells/783550_1766368436272/bin/npm
    pnpm: 10.22.0 - /run/user/1000/fnm_multishells/783550_1766368436272/bin/pnpm
  Browsers:
    Chrome: 143.0.7499.109
    Firefox: 146.0.1
    Firefox Developer Edition: 146.0.1
  npmPackages:
    vite: ^7.3.0 => 7.3.0

Used Package Manager

npm

Logs

Expected: The .cts file should be transpiled by esbuild (with loader: 'ts').

Actual:

FAILED
Parse failure: Expected ',', got 'as'
At file: test.cts:2:15

This error occurs because the TypeScript-specific as const syntax was not transpiled and was passed directly to Rollup's JavaScript parser, which doesn't understand TypeScript syntax.

Validations

Metadata

Metadata

Assignees

No one assigned

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions