If you’re using Cypress with TypeScript in your project, it’s possible you may encounter the following error message when trying to run Cypress:
Could not load a Cypress configuration file because there are multiple matches.
We've found 2 Cypress configuration files named cypress.config.ts, cypress.config.js at the location below:
/home/chris/Development/cypress-validate-dropdown-options-example
Please delete the conflicting configuration files.
And how this looks in Cypress itself:
The issue is fairly easy to resolve.
Simply delete all the conflicting configuration files.
In my case I wanted to keep cypress.config.ts
, and so remove cypress.config.js
.
Easy enough.
However, depending on your project, or even your editor’s configuration, you may find these files mysteriously keep coming back.
If that is the case, and you use WebStorm, one potential ‘fix’ is to ensure you do not have “Recompile on changes” checked in your TypeScript settings:
If that box is checked, whenever you change a TypeScript file, all your TypeScript files appear to be compiled in place, regardless of your tsconfig.json
settings.
As such you end up with a JavaScript / compiled version of the file displaying as a ‘sub file’ (for want of a better term) of your TypeScript file:
I haven’t found a way to make WebStorm behave in a way that it respects the tsconfig.json
file. Even if I explicitly add in the include
and exclude
config, it still occurs:
I’m not quite sure what’s happening there. WebStorm seems to be doing its own thing.
Anyway, it’s probably for the best, particularly on a shared project, not to have the IDE doing too much. Better to use a shared, common approach that is unrelated to whatever editor is being used.
So I feel unchecking that ‘Recompile on changes’ box should be the right thing to do in most cases.
Just be aware that even when you clean up your cypress.config.ts
issues, you will probably have a few more to solve that are similar:
There were multiple support files found matching your supportFile pattern.
Your supportFile is set to: cypress/support/e2e.{js,jsx,ts,tsx}
We found the following files:
/home/chris/Development/cypress-validate-dropdown-options-example/cypress/support/e2e.js
/home/chris/Development/cypress-validate-dropdown-options-example/cypress/support/e2e.ts
Please remove or combine the support files into a single file.
Code language: JavaScript (javascript)
Thankfully just a bit of a chore, and nothing more serious.