将 WalletConnect 与 html 应用程序连接

问题描述 投票:0回答:1

我需要将 WalletConnect Web3Modal 与 html 应用程序连接。

我正在逐步遵循文档:https://docs.walletconnect.com/2.0/web3modal/html-js/installation

但是服务器返回错误。

有什么方法可以解决这个问题?

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

这是我的代码示例:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>WC</title>
    <script type="module" >
      import { EthereumClient, w3mConnectors, w3mProvider } from './node_modules/@web3modal/ethereum'
      import { Web3Modal } from './node_modules/@web3modal/html'
      import { configureChains, createClient } from './node_modules/@wagmi/core'
      import { arbitrum, mainnet, polygon } from './node_modules/@wagmi/core/chains'

      const chains = [arbitrum, mainnet, polygon]
      const projectId = 'YOUR_PROJECT_ID'

      const { provider } = configureChains(chains, [w3mProvider({ projectId })])
      const wagmiClient = createClient({
        autoConnect: true,
        connectors: w3mConnectors({ projectId, version: 1, chains }),
        provider
      })
      const ethereumClient = new EthereumClient(wagmiClient, chains)
      const web3modal = new Web3Modal({ projectId }, ethereumClient)
    </script>
  </head>

  <body>
    <w3m-core-button></w3m-core-button>
  </body>

</html>

我还尝试使用reactjs在本地主机上运行WalletConnect,一切都很好,但我需要将它与html应用程序集成。

reactjs ethereum web3js wallet-connect web3modal
1个回答
0
投票

为 id 为“app”的页面添加包装器

 <div id="app">
    <w3m-core-button></w3m-core-button>
  </div>

© www.soinside.com 2019 - 2024. All rights reserved.