SolidJS TypeScript JSX error from wrong jsxImportSource in CI

For Solid, TypeScript must be told to use Solid's JSX types via "jsx": "preserve" and "jsxImportSource": "solid-js". With React or default JSX settings, tsc type-checks Solid JSX against the wrong definitions and CI type-check fails.

What this error means

A tsc --noEmit step fails with JSX element type errors or "property does not exist on JSX.IntrinsicElements", even though the app runs, because jsxImportSource is not solid-js.

tsc

error TS2604: JSX element type 'div' does not have any construct or call signatures.
error TS2786: 'Component' cannot be used as a JSX component.

Common causes

jsxImportSource is not solid-js

A React-oriented tsconfig points JSX types at React, so Solid components and intrinsic elements do not type-check.

jsx is set to react-jsx instead of preserve

Solid needs "jsx": "preserve" so the Babel/Vite transform handles JSX; react-jsx makes tsc emit the wrong runtime.

How to fix it

Point tsconfig at Solid JSX

Set "jsx": "preserve" and "jsxImportSource": "solid-js" in tsconfig.
Remove any React JSX types from types/lib for the app.
Re-run tsc --noEmit to confirm the type-check passes.

tsconfig.json

{
  "compilerOptions": {
    "jsx": "preserve",
    "jsxImportSource": "solid-js"
  }
}

Match the Vite Solid transform

Keep vite-plugin-solid as the JSX transform so runtime and types agree.

How to prevent it

Use jsx: preserve + jsxImportSource: solid-js in Solid projects.
Do not pull React JSX types into a Solid app.
Run tsc --noEmit in CI to catch JSX typing early.