## TL;DR
Cypress component testing boots your real dev server, so a bad devServer config kills the run before any spec executes. Match the framework and bundler in cypress.config.js, install the matching dev-server package, and make sure the port is free.

## Error
```text
CypressError: Component Testing failed to start the dev server.

We tried to start your dev server with the configured framework and bundler,
but it exited unexpectedly. Check the dev server output above for the real error.
```

## Steps
1. Open cypress.config.js and check the component.devServer block matches your stack:
```js
const { defineConfig } = require('cypress')

module.exports = defineConfig({
  component: {
    devServer: {
      framework: 'react',
      bundler: 'vite',
    },
  },
})
```
Expected: framework names your UI library and bundler names your build tool.
2. Install the dev-server package Cypress needs for that bundler, for example the Cypress vite dev server package for vite projects. Expected: the package appears in package.json devDependencies.
3. Start your dev server by hand with the same command your project uses. Expected: it boots without errors, which rules out a broken app config.
4. Check nothing else is on the dev server port, and that the port is not hard-coded differently in two places. Expected: the port is free and configured in exactly one place.
5. Run npx cypress open --component again. Expected: the dev server starts and specs mount.

## When to use
- Component testing dies before any spec runs
- The failure started after switching bundlers or frameworks
- A teammate's checkout works but yours does not

## When not to use
- Specs run but assertions fail (a test problem, not a dev-server problem)
- E2E tests cannot reach the app (see the ECONNREFUSED fix instead)
- The bundler itself fails to build outside Cypress (fix the app config first)

## Tool compatibility
- Cypress 12 through 14 component testing
- React, Vue, Angular, and Svelte with vite or webpack dev servers
- The matching Cypress dev-server package for your bundler

## Variant phrasings
### Cypress component testing dev server exited unexpectedly
Read the dev server output above the Cypress error. The real cause, usually a bad import or a port clash, prints there.
### Vite dev server fails to start under Cypress
Confirm the vite config Cypress picks up is the same one npm run dev uses. A second config file is a common culprit.

## Why it happens
Cypress does not bundle your components itself. It shells out to your framework's dev server through a small adapter package. If the adapter is missing, the framework name is wrong, or the underlying dev server cannot boot, Cypress reports the failure as its own startup error.

## Edge cases
- Works with npm run dev but not under Cypress: Cypress may resolve a different config file. Point devServer at the right one explicitly.
- Port already in use by a zombie process: kill it or set a different port in one place.
- Monorepo: the dev server must start with the package's own config, not the repo root's.

## Provenance

Resolved from the public thread: https://vectle.com/posts/pst_3l7XttJpG_rljg1yaBZw0Q
