I've installed Cypress into an existing Vue 3 project and just ran npx cypress open
. That opened a window to set up component testing. Once I let it do its things creating the necessary files, I'm greeted with this error:
Your configFile is invalid: /usr/local/htdocs/SOME_PROJECT/cypress.config.ts
It threw an error when required, check the stack trace below:
Error: Cannot find module 'file:///usr/local/htdocs/SOME_PROJECT/cypress.config.ts'
Require stack:
- /Users/bluefirex/Library/Caches/Cypress/13.3.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js
- /Users/bluefirex/Library/Caches/Cypress/13.3.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/require_async_child.js
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:1077:15)
at Function.Module._resolveFilename.sharedData.moduleResolveFilenameHook.installedValue [as _resolveFilename] (/Users/bluefirex/Library/Caches/Cypress/13.3.1/Cypress.app/Contents/Resources/app/node_modules/@cspotcode/source-map-support/source-map-support.js:811:30)
at Function.Module._load (node:internal/modules/cjs/loader:922:27)
at Module.require (node:internal/modules/cjs/loader:1143:19)
at require (node:internal/modules/cjs/helpers:121:18)
at /Users/bluefirex/Library/Caches/Cypress/13.3.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:106:34
at processTicksAndRejections (node:internal/process/task_queues:95:5)
at async loadFile (/Users/bluefirex/Library/Caches/Cypress/13.3.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:106:14)
at async EventEmitter.<anonymous> (/Users/bluefirex/Library/Caches/Cypress/13.3.1/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:116:32)
The file definitely exists and if I paste that file-URL into my browsers, I'll see the contents.
These are the contents of the config:
import { defineConfig } from "cypress";
export default defineConfig({
component: {
devServer: {
framework: "vue",
bundler: "vite"
}
}
});
TypeScript 5.2.2, Vue 3.3.4 and Vite 4.4.11 are installed (and in use). If I set up cypress/tsconfig.json
as per their example project:
{
"compilerOptions": {
"target": "es5",
"lib": ["es5", "dom"],
"types": ["cypress", "node"],
"jsx": "preserve"
},
"include": ["**/*.ts", "../cypress.d.ts"]
}
I still get absolutely no change.
What can I do here?