Cypress + Vite 5 + Typescript: exports is not defined in ES module scope

[NormalCrazy000]

Current behavior

When I try to start cypress in a vite 5 project with typescript the console returns this error:

I think it is due to cypress having problems with the tsconfig.json structure created by vite.
I added cypress.config.ts inside include in tsconfig.app.josn, but even putting it in tsconfig.node.json the result does not change.
The 3 tsconfigs you will find I did not create, but are the basic vite react configuration (npm create vite@latest my-vue-app -- --template react-ts ). I just created the cypress setup with npx cypress open and, right away, the error appeared that referred to the cypress configuration.

Desired behavior

I would like to be able to run cypress in a newly created vite 5 project

Test code to reproduce

Repo

https://github.com/NormalCrazy000/vite5-Cypress.git

Steps to replicate

1. npm install
2. npx cypress open

Cypress Version

13.15.0

Node version

18.19.1

Operating System

Windows

Debug Logs

No response

Other

No response

[MikeMcC399]

@NormalCrazy000

• This is similar to issue Scaffolded project with "tsc --init" + "type": "module" fails to compile due to conflicting module/commonjs  #27359

You can try the suggestion from that issue and add the following directly to the top of tsconfig.json (or use "module": "ESNext" which vite is already using in the other tsconfig files for app and node):

  "compilerOptions": {
    "module": "ES2015"
  }

tsconfig.json would be then:

{
  "compilerOptions": {
    "module": "ESNext"
  },
  "files": [],
  "references": [
    { "path": "./tsconfig.app.json" },
    { "path": "./tsconfig.node.json" }
  ]
}

An alternative workaround is to rename cypress.config.ts to cypress.config.js.

[NormalCrazy000]

Thank you very much, add module worked. Sorry for the repetition.

[MikeMcC399]

@NormalCrazy000

Thank you very much, add module worked.

It's good to hear that the configuration worked for you!

Sorry for the repetition.

No problem!

You should be able to close this issue now using the button below ⬇️

[iacullo-atri]

I don't believe this issue should be closed, as this issue indicates that cypress will not accept the TypeScript configuration from any tsconfig files unless they are named specifically tsconfig.json.

Shouldn't it read the configuration from tsconfig.node.json if that file references it in its files or includes sections?

[ThnxFredrik]

I agree with @iacullo-atri, adding "module": "ESNext" feels like a hack. Can't we specify which tsconfig to use for Cypress?

[michaelflore]

This of course worked as well for me when adding to tsconfig.json (using vite)

{
"ts-node": {
"compilerOptions": {
"module": "ESNext"
}
},
"files": [],
"references": [
{ "path": "./tsconfig.app.json" },
{ "path": "./tsconfig.node.json" }
]
}

So it seems like cypress is using ts-node and is only picking up the tsconfig in the root directory.

(cause when I followed the cypress docs and added a tsconfig.json to the cypress folder, with compiler options, still get error)