[SOLVED] Error: TypeError: Cannot read properties of undefined (reading 'length') at configureChains

Moralis General
#1

Hi, I’m trying to follow the article here: https://moralis.io/add-sign-in-with-magic-link-to-your-nextjs-project-in-5-steps/ and also here: https://docs.moralis.io/docs/how-to-sign-in-with-metamask – and I just can’t seem to to get it to work.

I’m getting the error:

wait - compiling /_error (client and server)…
event - compiled client and server successfully in 68 ms (489 modules)
TypeError: Cannot read properties of undefined (reading ‘length’)
at configureChains (file:///…/moralis/moralis/node_modules/@wagmi/core/dist/chunk-DYHSCPJD.js:19:22)
at eval (webpack-internal:///./pages/_app.js:21:97)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

Can you please help me get past this? I am looking to use Moralis with React and Magic Auth. Thanks in advance!

Auth with Magic Link signing in after signing out doesn't bring back Google Auth prompt
#2

Hi @deepak.k.ghosh

Can you provide more details on which step from the tutorial has caused the error and how to reproduce the same?

#3

When I npm run dev after completing all steps as showed in the tutorial.

#4

Can you check this doc for tutorials steps. I was able to execute it by following this tutorial.

These are the following dependency versions which I am using. wagmi version might make a difference in case if you are using an old version.

"@everipedia/wagmi-magic-connector": "^0.7.1",
"@moralisweb3/next": "^2.10.0",
"moralis": "^2.10.0",
"wagmi": "0.8.10"
#5

The pre-requisite for this tutorial is to have Metamask working correctly right?

#6

Yes you need the MetaMask extension for the second tutorial you linked. What exact tutorial are you following that leads to this configureChains error?

#7

Metamask tutorial

Screenshot 2022-12-20 at 11.25.38 AM
Screenshot 2022-12-20 at 11.25.38 AM1970×958 82.2 KB

#8

The magic.link tutorial says

You can start this tutorial if you already have a NextJS dapp with MetaMask sign-in functionality.

So I went back to doing this tutorial. That’s when I’m getting the above error.

#9

Can you show your project’s package.json?

#10

I was having the same issue until I installed the same version of Wagmi that you’re using; the issue appears to be some change(s) made to Wagmi’s newer ^9.0 updates. My app works fine using 0.8.10

2 Likes
#11

yes. i updated the package.json to "wagmi": "0.8.10" and it worked

also remember for this particular tutorial the login function will show up at localhost:3000/signin … not just localhost

1 Like
#12

Fantastic thank you folks! We are getting closer! So now, I am able to enter my email and get a login link in my email, but then when I go to my app, it shows an error shown in attached screenshot.

Screenshot 2022-12-22 at 9.00.09 PM
Screenshot 2022-12-22 at 9.00.09 PM2466×1316 185 KB

In my console it shows the following:

MoralisError [Moralis SDK Error]: [C0009] Modules are started already. This method should be called only one time.

and then a bunch of at ... log.

Thoughts?

#13

You can fix this error by updating Moralis.start with a if condition like below.

if(!Moralis.Core.isStarted){
  await Moralis.start({ apiKey: "apikey" });
}

Do you have more details on which code is causing the error shown in image.

#14

I tried it, but same error. My request-message.js looks like this:

import Moralis from 'moralis';

const config = {
  domain: process.env.APP_DOMAIN,
  statement: 'Please sign this message to confirm your identity.',
  uri: process.env.NEXTAUTH_URL,
  timeout: 60,
};

export default async function handler(req, res) {
  const { address, chain, network } = req.body;

  if (!Moralis.Core.isStarted) {
    await Moralis.start({ apiKey: process.env.MORALIS_API_KEY });
  }

  try {
    const message = await Moralis.Auth.requestMessage({
      address,
      chain,
      network,
      ...config,
    });

    res.status(200).json(message);
  } catch (error) {
    res.status(400).json({ error });
    console.error(error);
  }
}

My .env.local looks like this:

APP_DOMAIN=localhost
MORALIS_API_KEY=...
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=...

The full error looks like:

MoralisError [Moralis SDK Error]: [C0009] Modules are started already. This method should be called only one time.
    at Core.<anonymous> (/Users/.../Documents/moralis-new/moralis-new/node_modules/@moralisweb3/common-core/lib/Core.js:94:35)
    at step (/Users/.../Documents/moralis-new/moralis-new/node_modules/@moralisweb3/common-core/lib/Core.js:33:23)
    at Object.next (/Users/.../Documents/moralis-new/moralis-new/node_modules/@moralisweb3/common-core/lib/Core.js:14:53)
    at /Users/.../Documents/moralis-new/moralis-new/node_modules/@moralisweb3/common-core/lib/Core.js:8:71
    at new Promise (<anonymous>)
    at __awaiter (/Users/.../Documents/moralis-new/moralis-new/node_modules/@moralisweb3/common-core/lib/Core.js:4:12)
    at Core.start (/Users/.../Documents/moralis-new/moralis-new/node_modules/@moralisweb3/common-core/lib/Core.js:88:57)
    at Object.start (/Users/.../Documents/moralis-new/moralis-new/node_modules/moralis/lib/index.js:32:21)
    at Object.authorize (webpack-internal:///(api)/./pages/api/auth/[...nextauth].js:35:74)
    at Object.callback (/Users/.../Documents/moralis-new/moralis-new/node_modules/next-auth/core/routes/callback.js:360:29)
    at AuthHandler (/Users/.../Documents/moralis-new/moralis-new/node_modules/next-auth/core/index.js:295:41)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async NextAuthHandler (/Users/.../Documents/moralis-new/moralis-new/node_modules/next-auth/next/index.js:23:19)
    at async /Users/.../Documents/moralis-new/moralis-new/node_modules/next-auth/next/index.js:59:32
    at async Object.apiResolver (/Users/.../Documents/moralis-new/moralis-new/node_modules/next/dist/server/api-utils/node.js:363:9)
    at async DevServer.runApi (/Users/.../Documents/moralis-new/moralis-new/node_modules/next/dist/server/next-server.js:487:9)
    at async Object.fn (/Users/.../Documents/moralis-new/moralis-new/node_modules/next/dist/server/next-server.js:749:37)
    at async Router.execute (/Users/.../Documents/moralis-new/moralis-new/node_modules/next/dist/server/router.js:253:36)
    at async DevServer.run (/Users/.../Documents/moralis-new/moralis-new/node_modules/next/dist/server/base-server.js:384:29)
    at async DevServer.run (/Users/.../Documents/moralis-new/moralis-new/node_modules/next/dist/server/dev/next-dev-server.js:741:20)
    at async DevServer.handleRequest (/Users/.../Documents/moralis-new/moralis-new/node_modules/next/dist/server/base-server.js:322:20) {
  isMoralisError: true,
  code: 'C0009',
  details: undefined,
  [cause]: undefined
}

Thank you for looking!

#15

Can you show your package.json?

#16 
{
  "name": "moralis-new",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "clean": "sudo rm -rf node_modules",
    "reinstall": "npm run clean && npm install",
    "rebuild": "npm run reinstall && npm run build",
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "rebuildrun": "npm run rebuild && npm run dev"
  },
  "dependencies": {
    "@everipedia/wagmi-magic-connector": "^0.7.1",
    "@moralisweb3/next": "^2.10.2",
    "@next/font": "13.1.0",
    "ethers": "^5.7.2",
    "moralis": "^2.10.2",
    "next": "13.1.0",
    "next-auth": "^4.18.7",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "wagmi": "0.8.10"
  },
  "devDependencies": {
    "@types/react": "18.0.26"
  }
}
#17

If you have any other file with Moralis.start then you should also add the if condition in that file, that could also throw that error.

#18

Okay fantastic that worked! Thank you so much!

When sign out, it says authentically with magic link, which is what I expect, but when I hit sign in, it doesn’t show me the google sign-in flow any more, it just signs me in. How do I make it so after signing out, they can sign in again using google?

Also super basic question perhaps, but why are a couple files named with square brackets and ellipsis e.g. […nextauth].js and […moralis].ts?

#19

You may need to clear your app’s local storage and/or cookies.

This is a Next.js concept, you can check out their docs.

#20

Thank you so much – greatly appreciate your help!