S
SolidJS•11mo ago
Yaki (ShibaTales)

Uncaught ReferenceError: React is not defined

Hello! I am using "solid-js": "^1.7.5" and "solid-start": "^0.2.32" for my solidjs project, but i'm getting this javascript-disabling bug! The full console error is below, any help is appreciated! ❤️ 
Uncaught ReferenceError: React is not defined
    default StartClient.tsx:81
    c dev.js:555
    untrack dev.js:444
    c dev.js:551
    runComputation dev.js:708
    updateComputation dev.js:690
    devComponent dev.js:562
    createComponent dev.js:1278
    <anonymous> entry-client.tsx:3
    render dev.js:117
    updateFn dev.js:181
    runUpdates dev.js:815
    createRoot dev.js:186
    render dev.js:115
    hydrate$1 dev.js:274
    hydrate dev.js:578
    mount mount.tsx:108
    <anonymous> entry-client.tsx:3
Uncaught ReferenceError: React is not defined
    default StartClient.tsx:81
    c dev.js:555
    untrack dev.js:444
    c dev.js:551
    runComputation dev.js:708
    updateComputation dev.js:690
    devComponent dev.js:562
    createComponent dev.js:1278
    <anonymous> entry-client.tsx:3
    render dev.js:117
    updateFn dev.js:181
    runUpdates dev.js:815
    createRoot dev.js:186
    render dev.js:115
    hydrate$1 dev.js:274
    hydrate dev.js:578
    mount mount.tsx:108
    <anonymous> entry-client.tsx:3
and the vite.config.ts was like this out of the box: 
import { defineConfig } from "vite";
import solid from "solid-start/vite";
import vercel from "solid-start-vercel";

export default defineConfig({
  plugins: [ solid({ adapter: vercel() }) ],
  build: {
    target: 'esnext',
  },
});
import { defineConfig } from "vite";
import solid from "solid-start/vite";
import vercel from "solid-start-vercel";

export default defineConfig({
  plugins: [ solid({ adapter: vercel() }) ],
  build: {
    target: 'esnext',
  },
});
20 Replies
lobster theremin
lobster theremin•11mo ago
Do you use any packages?
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
"devDependencies": {
    "@types/node": "^20.11.13",
    "@types/papaparse": "^5.3.14",
    "autoprefixer": "^10.4.17",
    "postcss": "^8.4.33",
    "solid-start-vercel": "^0.2.32",
    "tailwindcss": "^3.4.1",
    "typescript": "^5.0.4",
    "vite": "^4.3.8"
  },
  "dependencies": {
    "@solidjs/meta": "^0.28.5",
    "@solidjs/router": "^0.8.2",
    "flowbite": "^2.2.1",
    "papaparse": "^5.4.1",
    "solid-js": "^1.7.8",
    "solid-start": "^0.2.26",
    "undici": "^5.22.1"
  },
"devDependencies": {
    "@types/node": "^20.11.13",
    "@types/papaparse": "^5.3.14",
    "autoprefixer": "^10.4.17",
    "postcss": "^8.4.33",
    "solid-start-vercel": "^0.2.32",
    "tailwindcss": "^3.4.1",
    "typescript": "^5.0.4",
    "vite": "^4.3.8"
  },
  "dependencies": {
    "@solidjs/meta": "^0.28.5",
    "@solidjs/router": "^0.8.2",
    "flowbite": "^2.2.1",
    "papaparse": "^5.4.1",
    "solid-js": "^1.7.8",
    "solid-start": "^0.2.26",
    "undici": "^5.22.1"
  },
and my tsconfig: 
{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "node",
    "jsxImportSource": "solid-js",
    "jsx": "preserve",
    "types": ["vite/client"],
    "baseUrl": "./",
    "paths": {
      "~/*": ["./src/*"]
    }
  }
}
{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "node",
    "jsxImportSource": "solid-js",
    "jsx": "preserve",
    "types": ["vite/client"],
    "baseUrl": "./",
    "paths": {
      "~/*": ["./src/*"]
    }
  }
}
it's such a weird bug, like why would solidjs require React lol. i even checked the node_modules files and it's all solid solidjs
lobster theremin
lobster theremin•11mo ago
well... it probably doesn't fwiw it might be flowbite you'd have to check by commenting out imports if removing flowbite fixes it... well, then it's flowbite
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
let me try that out first was not that let me try one more thing no it didn't work, and the error is stemming from the solid-start package via vercel init
lobster theremin
lobster theremin•11mo ago
I'm not sure if that adapter is needed or up-to-date 3 months since last update
lxsmnsyc
lxsmnsyc•11mo ago
the adapters themselves are deprecated. TBF he's using a version of solid-start that is no longer supported it's most likely something to do with the vite plugin. It maybe installing the most recent one I recall this issue being brought up months ago
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
do i need to bump down the version? or should i try another version of solid-start somewhere? and thanks for the responses!
lxsmnsyc
lxsmnsyc•11mo ago
via resolutions I think, can you check the lockfile? check which version of vite-plugin-solid is getting installed I'm not sure which version of old solid-start is meant to be supported
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
vite-plugin-solid "^2.7.0"
lxsmnsyc
lxsmnsyc•11mo ago
is that what the lockfile is pointing to what package manager are you using
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
yarn pnpm seemed to also have the issue it worked for a little while on yarn and then all of a sudden
lxsmnsyc
lxsmnsyc•11mo ago
because this seems like a "dependency info" not the actual package version
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
oh 
vite-plugin-solid@^2.7.0:
  version "2.9.1"
  resolved "https://registry.yarnpkg.com/vite-plugin-solid/-/vite-plugin-solid-2.9.1.tgz#916cd0894afb48d1e0917bae9a52113d8778837d"
  integrity sha512-RC4hj+lbvljw57BbMGDApvEOPEh14lwrr/GeXRLNQLcR1qnOdzOwwTSFy13Gj/6FNIZpBEl0bWPU+VYFawrqUw==
  dependencies:
    "@babel/core" "^7.23.3"
    "@types/babel__core" "^7.20.4"
    babel-preset-solid "^1.8.4"
    merge-anything "^5.1.7"
    solid-refresh "^0.6.3"
    vitefu "^0.2.5"
vite-plugin-solid@^2.7.0:
  version "2.9.1"
  resolved "https://registry.yarnpkg.com/vite-plugin-solid/-/vite-plugin-solid-2.9.1.tgz#916cd0894afb48d1e0917bae9a52113d8778837d"
  integrity sha512-RC4hj+lbvljw57BbMGDApvEOPEh14lwrr/GeXRLNQLcR1qnOdzOwwTSFy13Gj/6FNIZpBEl0bWPU+VYFawrqUw==
  dependencies:
    "@babel/core" "^7.23.3"
    "@types/babel__core" "^7.20.4"
    babel-preset-solid "^1.8.4"
    merge-anything "^5.1.7"
    solid-refresh "^0.6.3"
    vitefu "^0.2.5"
lxsmnsyc
lxsmnsyc•11mo ago
okay so it resolved to 2.9.1 You'd want to downgrade that so you want to install "vite-plugin-solid": "2.7.2" as an exact version
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
plugins: [ solid({ adapter: vercel() }) ],
plugins: [ solid({ adapter: vercel() }) ],
instead of this i should use vite-plugin-solid instead?
lxsmnsyc
lxsmnsyc•11mo ago
no, solid-start uses vite-plugin-solid internally but it's using the recent one and since the old solid-start only works with the old vite-plugin
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
"devDependencies": {
    "@types/node": "^20.11.13",
    "@types/papaparse": "^5.3.14",
    "autoprefixer": "^10.4.17",
    "postcss": "8.4.35",
    "solid-start-vercel": "0.2.32",
    "tailwindcss": "^3.4.1",
    "typescript": "5.3.3",
    "vite": "4.5.2",
    "vite-plugin-solid": "2.7.2"
  },
  "dependencies": {
    "@solidjs/meta": "0.28.7",
    "@solidjs/router": "0.8.4",
    "flowbite": "^2.2.1",
    "papaparse": "^5.4.1",
    "solid-js": "1.7.8",
    "solid-start": "0.2.32",
    "undici": "^5.22.1"
  },
"devDependencies": {
    "@types/node": "^20.11.13",
    "@types/papaparse": "^5.3.14",
    "autoprefixer": "^10.4.17",
    "postcss": "8.4.35",
    "solid-start-vercel": "0.2.32",
    "tailwindcss": "^3.4.1",
    "typescript": "5.3.3",
    "vite": "4.5.2",
    "vite-plugin-solid": "2.7.2"
  },
  "dependencies": {
    "@solidjs/meta": "0.28.7",
    "@solidjs/router": "0.8.4",
    "flowbite": "^2.2.1",
    "papaparse": "^5.4.1",
    "solid-js": "1.7.8",
    "solid-start": "0.2.32",
    "undici": "^5.22.1"
  },
i looked at the other package versions too and hard coded exact versions; still, it persists
lxsmnsyc
lxsmnsyc•11mo ago
have you used resolutions to enforce
Yaki (ShibaTales)
Yaki (ShibaTales)OP•11mo ago
npm-force-resolutions? Or just adding a resolutions field to package.json? Trying it now ....that worked ❤️ thanks you for your help and for your patience 🙂
Katja (katywings)
Katja (katywings)•11mo ago
@lxsmnsyc 🤖 Should solid-refresh also be pinned to an old version for old solid-start beta1 or is v0.7.4 fine? 😅
Want results from more Discord servers?
Add your server