feat: debug example-wallet-js (failed)

examples/example-wallet-js/index.html

@@ -49,7 +49,7 @@ <h3>xterio-wallet sdk</h3>
 </body>
 <script type="module" src="./src/module.js"></script>
 <!-- <script type="text/babel" src="./src/index.js"></script> -->
-<script type="text/babel" src="./src/test.js"></script>
 <!-- <script type="text/babel" src="./src/test.js"></script> -->
+<script type="module" src="./src/test.js"></script>
 
 </html>

examples/example-wallet-js/src/module.js

@@ -1,3 +1,4 @@
+console.log('module')
 import React from 'https://esm.sh/react?dev'
 import ReactDOM from 'https://esm.sh/react-dom?dev'
 import ReactDOMClient from 'https://esm.sh/react-dom/client?dev'
@@ -6,13 +7,29 @@ window.React = React
 window.ReactDOM = ReactDOM
 window.ReactDOMClient = ReactDOMClient
 
-import 'https://esm.sh/@particle-network/[email protected]?bundle'
+// import 'https://esm.sh/@particle-network/[email protected]?bundle'
+// import 'https://esm.sh/@particle-network/[email protected]?bundle'
+// import 'https://esm.sh/@particle-network/[email protected]?bundle'
+// import 'https://esm.sh/@particle-network/[email protected]?bundle'
+
+// 'ahooks', 'antd', '@ant-design/icons'
+// import 'https://esm.sh/[email protected]'
+// import 'https://esm.sh/antd'
+// import 'https://esm.sh/@ant-design/icons'
+// import 'https://esm.sh/axios'
 
 import * as XterioAuth from 'https://esm.sh/@xterio-sdk/[email protected]'
 window.XterioAuth = XterioAuth
 
 // import * as XterioWallet from 'https://esm.sh/@xterio-sdk/[email protected]?bundle&alias=react:React"'
 
-import * as XterioWallet from 'https://esm.sh/@xterio-sdk/[email protected]?bundle'
-console.log('cccc', XterioWallet)
+// import * as XterioWallet from 'https://esm.sh/[email protected]?bundle'
+
+import * as XterioWallet from 'https://esm.sh/[email protected]?bundle&deps=axios,[email protected],[email protected]&dev'
 window.XterioWallet = XterioWallet
+
+// console.log('[1]XterioWallet=', XterioWallet)
+// console.log('[1]XterioAuth=', XterioAuth)
+
+// console.log('[1]React=', React)
+// console.log('[1]ReactDOM=', ReactDOM)

examples/example-wallet-js/src/test.js

@@ -1,15 +1,3 @@
-const React = window.React
-const ReactDOM = window.ReactDOMClient
-
-const XterioAuth = window.XterioAuth
-const XterioWallet = window.XterioWallet
-
-console.log('XterioWallet=', XterioWallet)
-console.log('XterioAuth=', XterioAuth)
-
-console.log('React=', React)
-console.log('ReactDOM=', ReactDOM)
-
 const redirect_uri = 'http://localhost:3000/'
 const client_id = '4gsmgur6gkp8u9ps8dlco3k7eo'
 const client_secret = 'ABC23'
@@ -23,48 +11,53 @@ const config = {
   pn_app_id: '40ad8524-f844-496d-8de2-50a8a322d6ba'
 }
 
+// const App = () => {
+//   return (
+//     <div>
+//       <h1>Hello, ESM React!</h1>
+//     </div>
+//   )
+// }
 const App = () => {
-  const [count, setcount] = React.useState(11)
-  return (
-    <div>
-      <h1>Hello, ESM React!{count}</h1>
-    </div>
-  )
+  return React.createElement('div', null, React.createElement('h1', null, 'Hello, ESM React!'))
 }
 
 const GlobalProvider = ({ children }) => {
   // 在这里可以实现你的 Provider 逻辑
   return children
 }
 
-const root = ReactDOMClient.createRoot(document.getElementById('app'))
-root.render(
-  <GlobalProvider>
-    <App />
-  </GlobalProvider>
-)
-// root.render(
-//   <XterioWallet.XterioWalletProvider {...config}>
-//     <App />
-//   </XterioWallet.XterioWalletProvider>
-// )
+const init = () => {
+  const React = window.React
+  const ReactDOMClient = window.ReactDOMClient
 
-// // 创建一个全局的 Provider
-// const GlobalProvider = ({ children }) => {
-//   // 在这里可以实现你的 Provider 逻辑
-//   return children
-// }
-// ReactDOM.createRoot(document.getElementById('root')).render(
-//   <GlobalProvider>
-//     <App />
-//   </GlobalProvider>
-// )
+  const XterioAuth = window.XterioAuth
+  const XterioWallet = window.XterioWallet
+
+  console.log('XterioWallet=', XterioWallet)
+  console.log('XterioAuth=', XterioAuth)
 
-/*
-import { XterioAuth } from 'https://esm.sh/@xterio-sdk/[email protected]'
-console.log(XterioAuth)
-XterioAuth.init(config)
-// import 'https://esm.sh/axios'
-import * as XterioWallet from 'https://esm.sh/@xterio-sdk/[email protected]?bundle'
-console.log(XterioWallet)
-*/
+  console.log('React=', React)
+  console.log('ReactDOMClient=', ReactDOMClient)
+
+  const root = ReactDOMClient.createRoot(document.getElementById('app'))
+  // root.render(
+  //   <GlobalProvider>
+  //     <App />
+  //   </GlobalProvider>
+  // )
+
+  // root.render(
+  //   <XterioWallet.XterioWalletProvider {...config}>
+  //     <App />
+  //   </XterioWallet.XterioWalletProvider>
+  // )
+
+  root.render(React.createElement(XterioWallet.XterioWalletProvider, { ...config }, React.createElement(App)))
+}
+
+window.onload = () => {
+  setTimeout(() => {
+    init()
+  }, 2000)
+}