Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

When using the adapter, I encountered the issue "Module not found: Can't resolve 'aptos'." #405

Open
caoyang2002 opened this issue Aug 25, 2024 · 5 comments
Open

When using the adapter, I encountered the issue "Module not found: Can't resolve 'aptos'." #405

caoyang2002 opened this issue Aug 25, 2024 · 5 comments

Comments

@caoyang2002
Copy link

caoyang2002 commented Aug 25, 2024 •
edited
Loading

Link

https://aptos.dev/en/build/sdks/wallet-adapter/dapp

Issues

When using the adapter, I encountered the following issue, and I hope to understand the reason why this problem was thrown.

./node_modules/@aptos-connect/wallet-adapter-plugin/dist/index.mjs:357:1
Module not found: Can't resolve 'aptos'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./node_modules/@aptos-labs/wallet-adapter-react/node_modules/@aptos-labs/wallet-adapter-core/dist/index.mjs
./node_modules/@aptos-labs/wallet-adapter-react/dist/index.mjs
./src/app/layout.tsx

code sandbox

code sandbox

yarn dev

Current status

  • nextjs (app routor)

package.json

{
  "name": "connect-wallet-adapter",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@aptos-labs/ts-sdk": "^1.27.1",
    "@aptos-labs/wallet-adapter-ant-design": "^3.0.11",
    "@aptos-labs/wallet-adapter-react": "^3.6.0",
    "next": "14.2.6",
    "petra-plugin-wallet-adapter": "^0.4.5",
    "react": "^18",
    "react-dom": "^18"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "eslint": "^8",
    "eslint-config-next": "14.2.6",
    "postcss": "^8",
    "tailwindcss": "^3.4.1",
    "typescript": "^5"
  }
}

src/app/layout.tsx

'use client'

import { PropsWithChildren } from 'react'
import { PetraWallet } from 'petra-plugin-wallet-adapter'
import { AptosWalletAdapterProvider } from '@aptos-labs/wallet-adapter-react'
import { WalletSelector } from '@aptos-labs/wallet-adapter-ant-design'
import React from 'react'
import {
  Aptos,
  AptosConfig,
  Network,
  APTOS_COIN,
  AccountAddressInput,
} from '@aptos-labs/ts-sdk'

const wallets = [new PetraWallet()]
export default function RootLayout({ children }: PropsWithChildren) {
  return (
    <body className="grow">
      <AptosWalletAdapterProvider
        plugins={wallets}
        autoConnect={true}
        dappConfig={{
          network: Network.TESTNET,
          aptosConnectDappId: 'dapp-id',
        }}
      >
        <WalletSelector />
        <div className="mt-16">{children}</div>
      </AptosWalletAdapterProvider>
    </body>
  )
}
@estellechoi
Copy link

Me too. the package is not compatible with Next.js 14

@yadsendew
Copy link

Me too, can anyone fix this?

@o-az
Copy link

o-az commented Oct 26, 2024

same issue here. You could try installing aptos manually first.
Oddly, aptos is a deprecated package: https://npm.im/aptos and this is supposed to be the replacement.

@caoyang2002
Copy link
Author

It's possible that the error occurred because 'use client' was not used, as the rendering process for components with the adapter takes place entirely on the client side. If this marker is missing, an error will be reported.

https://github.com/Chyraw-Labs/aptos-case/tree/main/ts-case

@OlexBeatable
Copy link

It's possible that the error occurred because 'use client' was not used, as the rendering process for components with the adapter takes place entirely on the client side. If this marker is missing, an error will be reported.

https://github.com/Chyraw-Labs/aptos-case/tree/main/ts-case

I don't think that 'use client' will fix it, because I have the same issue using React, which is fully rendered on client. The only thing which helped me - is manual installing aptos by adding it to the project dependencies.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@o-az @OlexBeatable @estellechoi @yadsendew @caoyang2002