cache not imported from react error

mw2000 commented 1 month ago

I'm running into the following error on trying to use the library:

Attempted import error: 'cache' is not exported from 'react' (imported as 'cache')

Error trace

@witnessco/timestamp:build: ../../node_modules/.pnpm/nextjs-better-unstable-cache@1.1.0_next@14.2.4_react@18.3.1/node_modules/nextjs-better-unstable-cache/src/index.js
@witnessco/timestamp:build: Attempted import error: 'cache' is not exported from 'react' (imported as 'cache').
@witnessco/timestamp:build: 
@witnessco/timestamp:build: Import trace for requested module:
@witnessco/timestamp:build: ../../node_modules/.pnpm/nextjs-better-unstable-cache@1.1.0_next@14.2.4_react@18.3.1/node_modules/nextjs-better-unstable-cache/src/index.js
@witnessco/timestamp:build: ./src/cached/server/witness.ts
@witnessco/timestamp:build: 
@witnessco/timestamp:build: ../../node_modules/.pnpm/nextjs-better-unstable-cache@1.1.0_next@14.2.4_react@18.3.1/node_modules/nextjs-better-unstable-cache/src/index.js
@witnessco/timestamp:build: Attempted import error: 'cache' is not exported from 'react' (imported as 'cache').
@witnessco/timestamp:build: 
@witnessco/timestamp:build: Import trace for requested module:
@witnessco/timestamp:build: ../../node_modules/.pnpm/nextjs-better-unstable-cache@1.1.0_next@14.2.4_react@18.3.1/node_modules/nextjs-better-unstable-cache/src/index.js
@witnessco/timestamp:build: ./src/cached/server/witness.ts

Dependencies:

  "dependencies": {
    "@radix-ui/react-slot": "^1.1.0",
    "@radix-ui/react-tabs": "^1.1.0",
    "@witnessco/client": "^0.5.0",
    "@witnessco/core-db": "workspace:*",
    "@witnessco/tsconfig": "workspace:*",
    "class-variance-authority": "^0.7.0",
    "clsx": "^2.1.1",
    "dexie": "^3.2.7",
    "js-sha3": "^0.8.0",
    "next": "14.2.4",
    "nextjs-better-unstable-cache": "^1.0.0",
    "postgres": "^3.4.4",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "react-dropzone": "^14.2.3",
    "react-hot-toast": "^2.4.1",
    "react-icons": "^4.12.0",
    "react-tooltip": "^5.28.0",
    "server-only": "^0.0.1",
    "tailwind-merge": "^1.14.0",
    "viem": "2.9.25"
  },
  "devDependencies": {
    "@biomejs/biome": "^1.9.2",
    "@types/cookie": "^0.6.0",
    "@types/node": "^20.16.9",
    "@types/react": "^18.3.9",
    "@types/react-dom": "^18.3.0",
    "autoprefixer": "^10.4.20",
    "eslint": "^8.57.1",
    "eslint-config-next": "14.2.11",
    "pino-pretty": "^10.3.1",
    "postcss": "^8.4.47",
    "tailwindcss": "^3.4.13",
    "tailwindcss-animate": "^1.0.7",
        "typescript": "^5.4.5"
  }

catchergeese commented 1 month ago

React.cache is only available in canary and experimental channels (think: React 19) and your dependencies list react in version 18. You need to upgrade them to use React.cache.

AhmedBaset commented 1 month ago

Open Node.js REPL by running node in the terminal. Then

require("next/dist/compiled/react").version

Then update react and react-dom to that version

alfonsusac / nextjs-better-unstable-cache

cache not imported from react error #11