I'm encountering a persistent dependency conflict issue in my React/TypeScript project that I'm unable to resolve, despite numerous attempts. The issue is preventing me from building my application. I'm using the following main libraries: React, TypeScript, Tiptap, GrapesJS, BlockNote
Problem:
When running npm install or npm run build, I consistently get an
ERESOLVE unable to resolve dependency tree error
The error messages indicate conflicting peer dependencies between Tiptap, ProseMirror (the underlying editor library for Tiptap), and GrapesJS.
Here's a representative sample of the error messages:
npm error code ERESOLVE
npm error ERESOLVE could not resolve
npm error
npm error While resolving: @tiptap/[email protected]
npm error Found: @tiptap/[email protected]
npm error node_modules/@tiptap/pm
npm error @tiptap/pm@"2.4.0" from the root project
npm error
npm error Could not resolve dependency:
npm error peer @tiptap/pm@"^2.7.0" from @tiptap/[email protected]
npm error node_modules/@tiptap/core
npm error @tiptap/core@"^2.11.5" from @blocknote/[email protected]
npm error node_modules/@blocknote/core
npm error @blocknote/core@"^0.26.0" from @blocknote/[email protected]
npm error node_modules/@blocknote/mantine
npm error 1 more (@blocknote/react)
npm error peer @tiptap/core@"^2.7.0" from @tiptap/[email protected]
npm error node_modules/@blocknote/core/node_modules/@tiptap/extension-collaboration
npm error @tiptap/extension-collaboration@"^2.11.5" from @blocknote/[email protected]
npm error node_modules/@blocknote/core
npm error @blocknote/core@"^0.26.0" from @blocknote/[email protected]
npm error node_modules/@blocknote/mantine
npm error 1 more (@blocknote/react)
npm error 53 more (@tiptap/extension-collaboration-cursor, ...)
npm error
npm error Conflicting peer dependency: @tiptap/[email protected]
npm error node_modules/@tiptap/pm
npm error peer @tiptap/pm@"^2.7.0" from @tiptap/[email protected]
npm error node_modules/@tiptap/core
npm error @tiptap/core@"^2.11.5" from @blocknote/[email protected]
npm error node_modules/@blocknote/core
npm error @blocknote/core@"^0.26.0" from @blocknote/[email protected]
npm error node_modules/@blocknote/mantine
npm error 1 more (@blocknote/react)
npm error peer @tiptap/core@"^2.7.0" from @tiptap/[email protected]
npm error node_modules/@blocknote/core/node_modules/@tiptap/extension-collaboration
npm error @tiptap/extension-collaboration@"^2.11.5" from @blocknote/[email protected]
npm error node_modules/@blocknote/core
npm error @blocknote/core@"^0.26.0" from @blocknote/[email protected]
npm error node_modules/@blocknote/mantine
npm error 1 more (@blocknote/react)
npm error 53 more (@tiptap/extension-collaboration-cursor, ...)
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error C:\Users\Rafe\AppData\Local\npm-cache\_logs\2025-03-27T00_48_11_025Z-eresolve-report.txt
npm error A complete log of this run can be found in: C:\Users\Rafe\AppData\Local\npm-cache\_logs\2025-03-27T00_48_11_025Z-debug-0.log
What I've Tried:
I've tried numerous solutions, including:
Deleting node_modules and package-lock.json and reinstalling dependencies.
Clearing the npm cache ( npm cache clean --force ).
Using the --force and --legacy-peer-deps flags with npm install .
Explicitly installing specific versions of the Tiptap and GrapesJS packages.
Uninstalling and reinstalling the Tiptap and GrapesJS packages in various orders.
Here's my package.json file:
{
"name": "resume-fe",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"@11labs/react": "0.0.4",
"@ag-grid-enterprise/all-modules": "27.3.0",
"@auth0/auth0-react": "2.3.0",
"@blocknote/core": "^0.26.0",
"@blocknote/mantine": "^0.26.0",
"@blocknote/react": "^0.26.0",
"@bwip-js/browser": "4.5.2",
"@chakra-ui/icons": "2.1.1",
"@chakra-ui/react": "2.8.2",
"@chakra-ui/system": "2.6.2",
"@ckeditor/ckeditor5-build-classic": "42.0.2",
"@ckeditor/ckeditor5-react": "8.0.0",
"@clerk/clerk-react": "5.22.13",
"@dnd-kit/core": "6.1.0",
"@dnd-kit/sortable": "8.0.0",
"@dnd-kit/utilities": "3.2.2",
"@emotion/react": "11.11.3",
"@emotion/styled": "11.11.0",
"@fontsource/roboto": "5.1.1",
"@grapesjs/react": "^2.0.0",
"@heygen/streaming-avatar": "2.0.8",
"@hookform/resolvers": "^3.9.0",
"@lexical/react": "0.27.1",
"@liveblocks/client": "2.9.1",
"@liveblocks/react": "2.9.1",
"@liveblocks/zustand": "2.9.1",
"@mapbox/mapbox-gl-draw": "1.5.0",
"@mui/icons-material": "6.3.1",
"@mui/material": "6.3.1",
"@mysten/sui": "1.16.0",
"@novnc/novnc": "1.6.0-beta",
"@openai/realtime-api-beta": "github:openai/openai-realtime-api-beta",
"@pdfme/common": "5.3.3",
"@pdfme/generator": "5.3.3",
"@pdfme/schemas": "5.3.3",
"@pdfme/ui": "5.3.3",
"@play-ai/agent-web-sdk": "^0.1.0",
"@radix-ui/react-accordion": "^1.2.0",
"@radix-ui/react-alert-dialog": "^1.1.1",
"@radix-ui/react-aspect-ratio": "^1.1.0",
"@radix-ui/react-avatar": "^1.1.0",
"@radix-ui/react-checkbox": "^1.1.1",
"@radix-ui/react-collapsible": "^1.1.0",
"@radix-ui/react-context-menu": "^2.2.1",
"@radix-ui/react-dialog": "^1.1.1",
"@radix-ui/react-dropdown-menu": "^2.1.1",
"@radix-ui/react-hover-card": "^1.1.1",
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-label": "^2.1.0",
"@radix-ui/react-menubar": "^1.1.1",
"@radix-ui/react-navigation-menu": "^1.2.0",
"@radix-ui/react-popover": "^1.1.1",
"@radix-ui/react-progress": "^1.1.0",
"@radix-ui/react-radio-group": "^1.2.0",
"@radix-ui/react-scroll-area": "^1.1.0",
"@radix-ui/react-select": "^2.1.1",
"@radix-ui/react-separator": "^1.1.0",
"@radix-ui/react-slider": "^1.2.0",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-switch": "^1.1.0",
"@radix-ui/react-tabs": "^1.1.0",
"@radix-ui/react-toast": "^1.2.1",
"@radix-ui/react-toggle": "^1.1.0",
"@radix-ui/react-toggle-group": "^1.1.0",
"@radix-ui/react-tooltip": "^1.1.2",
"@react-google-maps/api": "2.20.3",
"@react-pdf/renderer": "3.4.4",
"@react-three/drei": "9.120.3",
"@react-three/fiber": "8.17.10",
"@remotion/player": "4.0.264",
"@reown/appkit": "1.5.2",
"@reown/appkit-adapter-solana": "1.5.3",
"@reown/appkit-adapter-wagmi": "1.5.2",
"@sanity/client": "6.28.0",
"@solana/spl-token": "^0.4.13",
"@solana/wallet-adapter-react": "0.15.35",
"@solana/wallet-adapter-wallets": "0.19.32",
"@solana/web3.js": "1",
"@stripe/firestore-stripe-payments": "0.0.6",
"@stripe/react-stripe-js": "2.9.0",
"@stripe/stripe-js": "^4.0.0",
"@suiet/wallet-kit": "0.3.3",
"@supabase/auth-ui-react": "0.4.7",
"@supabase/auth-ui-shared": "0.1.8",
"@supabase/supabase-js": "2.47.3",
"@tailwindcss/typography": "0.5.10",
"@talkjs/react": "0.1.11",
"@tanstack/react-query": "5.61.4",
"@tanstack/react-table": "^8.21.2",
"@tiptap/core": "^2.11.5",
"@tiptap/extension-bullet-list": "2.9.1",
"@tiptap/extension-character-count": "2.9.1",
"@tiptap/extension-code-block": "2.9.1",
"@tiptap/extension-code-block-lowlight": "2.9.1",
"@tiptap/extension-collaboration": "2.9.1",
"@tiptap/extension-collaboration-cursor": "2.9.1",
"@tiptap/extension-color": "2.9.1",
"@tiptap/extension-document": "2.9.1",
"@tiptap/extension-dropcursor": "2.9.1",
"@tiptap/extension-focus": "2.9.1",
"@tiptap/extension-font-family": "2.9.1",
"@tiptap/extension-heading": "2.9.1",
"@tiptap/extension-highlight": "2.9.1",
"@tiptap/extension-horizontal-rule": "2.9.1",
"@tiptap/extension-image": "2.9.1",
"@tiptap/extension-link": "2.9.1",
"@tiptap/extension-ordered-list": "2.9.1",
"@tiptap/extension-paragraph": "2.9.1",
"@tiptap/extension-placeholder": "2.9.1",
"@tiptap/extension-subscript": "2.9.1",
"@tiptap/extension-superscript": "2.9.1",
"@tiptap/extension-table": "2.9.1",
"@tiptap/extension-table-cell": "2.11.5",
"@tiptap/extension-table-header": "2.9.1",
"@tiptap/extension-table-row": "2.9.1",
"@tiptap/extension-task-item": "2.9.1",
"@tiptap/extension-task-list": "2.9.1",
"@tiptap/extension-text-align": "2.9.1",
"@tiptap/extension-text-style": "2.9.1",
"@tiptap/extension-typography": "2.9.1",
"@tiptap/extension-underline": "2.9.1",
"@tiptap/pm": "2.4.0",
"@tiptap/react": "^2.11.5",
"@tiptap/starter-kit": "2.4.0",
"@tomtom-international/web-sdk-maps": "6.25.0",
"@tomtom-international/web-sdk-services": "6.25.0",
"@turf/turf": "7.2.0",
"@uidotdev/usehooks": "2.4.1",
"@vapi-ai/web": "2.1.3",
"@wavesurfer/react": "1.0.7",
"@xyflow/react": "12.4.1",
"@xzdarcy/react-timeline-editor": "0.1.9",
"ag-grid-react": "32.1.0",
"agora-rtc-react": "2.3.0",
"agora-rtc-sdk-ng": "4.23.1",
"amplitude-js": "8.21.9",
"audio-decode": "2.2.2",
"chart.js": "4.4.7",
"ckeditor5": "42.0.2",
"ckeditor5-premium-features": "42.0.2",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"cmdk": "1.0.0",
"cobe": "0.6.3",
"convex": "1.11.2",
"daisyui": "4.12.23",
"date-fns": "^3.6.0",
"embla-carousel-react": "^8.2.1",
"epubjs": "0.3.93",
"fabric": "6.5.3",
"file-type": "20.1.0",
"firebase": "10.8.0",
"framer-motion": "10.18.0",
"grapejs": "^2.1.2",
"grapesjs": "0.22.5",
"grapesjs-react": "4.0.2",
"html2canvas": "1.4.1",
"html2pdf.js": "0.10.3",
"i18next": "24.2.0",
"i18next-browser-languagedetector": "8.0.2",
"idb": "8.0.2",
"input-otp": "^1.2.4",
"jspdf": "2.5.1",
"konva": "9.3.18",
"leaflet": "1.9.4",
"lexical": "0.27.1",
"lightweight-charts": "4.2.1",
"livekit-client": "2.7.3",
"lodash": "4.17.21",
"lucide-react": "^0.439.0",
"mammoth": "1.8.0",
"mapbox-gl": "3.1.2",
"mathjs": "14.2.1",
"mermaid": "^10.9.0",
"mixpanel-browser": "2.52.0",
"next-themes": "^0.3.0",
"openai-partial-stream": "0.3.9",
"pdfjs-dist": "^4.8.69",
"plotly.js": "2.27.1",
"qrcode.react": "4.2.0",
"react": "18.2.0",
"react-beautiful-dnd": "13.1.1",
"react-big-calendar": "1.17.1",
"react-big-schedule": "4.4.5",
"react-colorful": "5.6.1",
"react-confetti": "6.1.0",
"react-datasheet-grid": "4.11.4",
"react-day-picker": "8.10.1",
"react-diff-viewer": "3.1.1",
"react-dom": "18.2.0",
"react-dropzone": "14.3.5",
"react-easy-crop": "5.2.0",
"react-email-editor": "1.7.11",
"react-error-boundary": "4.0.11",
"react-firebase-hooks": "5.1.1",
"react-firebaseui": "6.0.0",
"react-grid-layout": "1.5.0",
"react-helmet": "6.1.0",
"react-hook-form": "^7.53.0",
"react-i18next": "15.4.0",
"react-icons": "5.0.1",
"react-intersection-observer": "9.14.1",
"react-konva": "19.0.3",
"react-leaflet": "4.2.1",
"react-lottie-player": "1.5.6",
"react-map-gl": "7.1.7",
"react-markdown": "9.0.1",
"react-mentions": "4.4.10",
"react-plotly.js": "2.6.0",
"react-quill": "2.0.0",
"react-reader": "2.0.12",
"react-remark": "2.1.0",
"react-resizable-panels": "^2.1.2",
"react-router-dom": "6.17.0",
"react-select": "5.8.0",
"react-slick": "0.30.2",
"react-social-media-embed": "2.5.17",
"react-table": "7.8.0",
"react-use-websocket": "4.9.0",
"react-virtualized-auto-sizer": "1.0.25",
"react-webcam": "7.2.0",
"react-window": "1.8.11",
"react-zxing": "2.0.2",
"recharts": "^2.12.7",
"recordrtc": "5.6.2",
"remark-gfm": "4.0.0",
"remotion": "4.0.264",
"shepherd.js": "14.1.0",
"sonner": "^1.5.0",
"stream-chat": "8.43.0",
"stream-chat-react": "12.5.1",
"tailwind-merge": "^2.5.2",
"tailwindcss-animate": "^1.0.7",
"talkjs": "0.31.0",
"tesseract.js": "5.1.1",
"three": "0.171.0",
"tone": "15.0.4",
"ts-morph": "^25.0.1",
"tsx": "^4.19.3",
"userflow.js": "2.12.1",
"vaul": "^0.9.2",
"viem": "2.21.51",
"vite-plugin-html-inject": "1.1.2",
"wagmi": "2.13.0",
"wavesurfer.js": "7.8.11",
"web-vitals": "4.2.4",
"xlsx": "0.18.5",
"zod": "^3.23.8",
"zustand": "4.5.5"
},
"devDependencies": {
"@biomejs/biome": "1.8.3",
"@firebase/app": "^0.11.1",
"@sentry/react": "7.101.1",
"@sentry/types": "7.101.1",
"@types/amplitude-js": "^8",
"@types/firebase": "^3.2.1",
"@types/leaflet": "1.9.14",
"@types/lodash": "^4",
"@types/mapbox__mapbox-gl-draw": "^1",
"@types/mapbox-gl": "2.7.20",
"@types/mixpanel-browser": "^2",
"@types/node": "20.6.2",
"@types/novnc__novnc": "^1",
"@types/react": "18.2.32",
"@types/react-beautiful-dnd": "^13",
"@types/react-big-calendar": "^1",
"@types/react-dom": "18.2.7",
"@types/react-grid-layout": "^1",
"@types/react-helmet": "^6",
"@types/react-mentions": "^4",
"@types/react-slick": "^0",
"@types/react-table": "^7",
"@types/react-window": "^1",
"@types/recordrtc": "^5",
"@types/three": "^0",
"@vitejs/plugin-react": "^4.0.0",
"@vitejs/plugin-react-swc": "3.3.2",
"autoprefixer": "^10.4.20",
"dotenv": "16.4.5",
"eslint": "8.45.0",
"eslint-plugin-react": "7.32.2",
"eslint-plugin-react-hooks": "4.6.0",
"eslint-plugin-react-refresh": "0.4.3",
"openapi-types": "12.1.3",
"postcss": "^8.4.45",
"raw-body": "2.5.2",
"tailwindcss": "^3.4.10",
"ts-prune": "0.10.3",
"type-fest": "4.6.0",
"typescript": "5.2.2",
"typescript-language-server": "4.3.2",
"vite": "4.4.5",
"vite-tsconfig-paths": "4.2.2"
},
"packageManager": "[email protected]",
"nodeLinker": "pnpm"
}
tsconfig.json:
Here's my tsconfig.json file:
{
"compilerOptions": {
"target": "ESNext",
"useDefineForClassFields": true,
"lib": [
"DOM",
"DOM.Iterable",
"ESNext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": false,
"allowSyntheticDefaultImports": true,
"allowImportingTsExtensions": true,
"strict": false,
"forceConsistentCasingInFileNames": true,
"module": "ESNext",
"moduleResolution": "Node",
"resolveJsonModule": true,
"isolatedModules": false,
"noEmit": true,
"jsx": "react-jsx",
"baseUrl": ".",
"paths": {
"brain": [
"./src/brain"
],
"types": [
"./src/brain/data-contracts.ts"
],
"components/*": [
"./src/components/*"
],
"pages/*": [
"./src/pages/*"
],
tsconfig.json:
{
"compilerOptions": {
"target": "ESNext",
"useDefineForClassFields": true,
"lib": [
"DOM",
"DOM.Iterable",
"ESNext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": false,
"allowSyntheticDefaultImports": true,
"allowImportingTsExtensions": true,
"strict": false,
"forceConsistentCasingInFileNames": true,
"module": "ESNext",
"moduleResolution": "Node",
"resolveJsonModule": true,
"isolatedModules": false,
"noEmit": true,
"jsx": "react-jsx",
"baseUrl": ".",
"paths": {
"brain": [
"./src/brain"
],
"types": [
"./src/brain/data-contracts.ts"
],
"components/*": [
"./src/components/*"
],
"pages/*": [
"./src/pages/*"
],