react-magic-motion icon indicating copy to clipboard operation
react-magic-motion copied to clipboard

Error: Invalid tag: [object Object]

Open andromidasj opened this issue 1 year ago • 16 comments

Hey! I have an app where I installed react-magic-motion, but am coming across this error and can't get it to work.

My app is built with:

  • React
  • NextJS (pages)
  • TailwindCSS

I installed the package with bun a react-magic-motion, then wrapped the contents in my main page in <MagicMotion>, imported with import { MagicMotion } from "react-magic-motion";. I immediately get the following error:

index.js:654 Uncaught Error: Invalid tag: [object Object]
    at startChunkForTag ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:2804:13)
    at pushStartGenericElement ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:2630:15)
    at pushStartInstance ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:2908:18)
    at renderHostElement ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:5636:18)
    at renderElement ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:5952:5)
    at renderNodeDestructiveImpl ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6104:11)
    at renderNodeDestructive ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6076:14)
    at renderNode ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6259:12)
    at renderChildrenArray ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6211:7)
    at renderNodeDestructiveImpl ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6141:7)
    at renderNodeDestructive ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6076:14)
    at renderContextProvider ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:5920:3)
    at renderElement ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6017:11)
    at renderNodeDestructiveImpl ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6104:11)
    at renderNodeDestructive ({MY_APP}/node_modules/react-dom/cjs/react-dom-server.browser.development.js:6076:14)
websocket.js:50 [HMR] connected

Some potentially notable package versions I'm running:

    "next": "^13.5.6",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-magic-motion": "^1.0.7",

andromidasj avatar Oct 25 '23 03:10 andromidasj