SolidJS•2y ago

Cannot find name 'React' when using Astro + TypeScript

I configured my Astro project to use SolidJS and even though I added the required tsconfig.json VSCode highlights every JSX tag with an error: Cannot find name 'React'.ts(2304) Astro compiles and runs fine, and tsc --noEmit also shows no errors. Am I missing something?

4 Replies

Raqueebuddin Aziz•2y ago

post the tsconfig

WesOP•2y ago

{
  "compilerOptions": {
    "allowJs": true,
    "allowUnreachableCode": false,
    "allowUnusedLabels": false,
    "alwaysStrict": true,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "exactOptionalPropertyTypes": true,
    "forceConsistentCasingInFileNames": true,
    "importHelpers": true,
    "jsx": "preserve",
    "jsxImportSource": "solid-js",
    "lib": ["DOM", "ESNext"],
    "module": "ESNext",
    "moduleResolution": "Node",
    "noFallthroughCasesInSwitch": true,
    "noImplicitAny": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noUncheckedIndexedAccess": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "resolveJsonModule": true,
    "rootDir": ".",
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "strictFunctionTypes": true,
    "strictNullChecks": true,
    "strictPropertyInitialization": true,
    "target": "ESNext",
    "verbatimModuleSyntax": true
  },
  "exclude": [".vercel", "node_modules"],
  "include": ["**/*.ts"],
  "ts-node": {
    "esm": true
  }
}

{
  "compilerOptions": {
    "allowJs": true,
    "allowUnreachableCode": false,
    "allowUnusedLabels": false,
    "alwaysStrict": true,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "exactOptionalPropertyTypes": true,
    "forceConsistentCasingInFileNames": true,
    "importHelpers": true,
    "jsx": "preserve",
    "jsxImportSource": "solid-js",
    "lib": ["DOM", "ESNext"],
    "module": "ESNext",
    "moduleResolution": "Node",
    "noFallthroughCasesInSwitch": true,
    "noImplicitAny": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noUncheckedIndexedAccess": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "resolveJsonModule": true,
    "rootDir": ".",
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "strictFunctionTypes": true,
    "strictNullChecks": true,
    "strictPropertyInitialization": true,
    "target": "ESNext",
    "verbatimModuleSyntax": true
  },
  "exclude": [".vercel", "node_modules"],
  "include": ["**/*.ts"],
  "ts-node": {
    "esm": true
  }
}

(I'm using TS 5.0rc1 here, but I tried on 4 and it also doesn't work)

Raqueebuddin Aziz•2y ago

and are you certain your vscode plugin is using this config? maybe try changing something to break something and check

WesOP•2y ago

ha, "include" was missing tsx (as I wasn't using tsx yet)

Gaming

Programming

Cannot find name 'React' when using Astro + TypeScript