change scripts loaded for dev server, fix walletConnect, update webpa…

…ck config, fix accounts error on no wallet connection (#1689)
blocknative · May 9, 2023 · 85f16b8 · 85f16b8
1 parent 3de448a
commit 85f16b8
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 3 deletions.
diff --git a/examples/with-vanilla-js/index.html b/examples/with-vanilla-js/index.html
@@ -4,7 +4,8 @@
     <meta charset="utf-8" />
     <link rel="icon" type="image/x-icon" href="./public/favicon.ico">
     <title>@web3-onboard with vanilla js</title>
-    <script defer src="dist/bundle.js"></script>
+    <script defer src="/runtime.js"></script>
+    <script defer src="/main.js"></script>
   </head>
   <body>
     <main class="main">

diff --git a/examples/with-vanilla-js/package.json b/examples/with-vanilla-js/package.json
@@ -10,8 +10,18 @@
   "author": "",
   "license": "ISC",
   "devDependencies": {
+    "assert": "^2.0.0",
+    "buffer": "^6.0.3",
+    "crypto-browserify": "^3.12.0",
     "css-loader": "^6.7.3",
+    "https-browserify": "^1.0.0",
+    "os-browserify": "^0.3.0",
+    "path-browserify": "^1.0.1",
+    "process": "^0.11.10",
+    "stream-browserify": "^3.0.0",
+    "stream-http": "^3.2.0",
     "style-loader": "^3.3.2",
+    "util": "^0.12.5",
     "webpack": "^5.79.0",
     "webpack-cli": "^5.0.2",
     "webpack-dev-server": "^4.13.3"

diff --git a/examples/with-vanilla-js/src/index.js b/examples/with-vanilla-js/src/index.js
@@ -28,9 +28,9 @@ const addConnectedInfo = connectedAccount => {
 
 $connect.addEventListener('click', async _ => {
   const wallets = await connect()
-  const connectedAccount = wallets[0].accounts[0]
-  label = wallets[0].label
   if (wallets[0]) {
+    const connectedAccount = wallets[0].accounts[0]
+    label = wallets[0].label
     addConnectedInfo(connectedAccount)
     $wallet.classList.remove('hidden')
     $disconnected.classList.add('hidden')

diff --git a/examples/with-vanilla-js/webpack.config.js b/examples/with-vanilla-js/webpack.config.js
@@ -1,4 +1,5 @@
 const path = require('path')
+const webpack = require('webpack')
 
 module.exports = {
   entry: './src/index.js',
@@ -7,6 +8,25 @@ module.exports = {
     path: path.resolve(__dirname, 'dist'),
     clean: true
   },
+  resolve: {
+    fallback: {
+      path: require.resolve('path-browserify')
+    },
+    alias: {
+      assert: 'assert',
+      buffer: 'buffer',
+      crypto: 'crypto-browserify',
+      http: 'stream-http',
+      https: 'https-browserify',
+      os: 'os-browserify/browser',
+      process: 'process/browser',
+      stream: 'stream-browserify',
+      util: 'util'
+    }
+  },
+  experiments: {
+    asyncWebAssembly: true
+  },
   module: {
     rules: [
       {
@@ -21,6 +41,12 @@ module.exports = {
       }
     ]
   },
+  plugins: [
+    new webpack.ProvidePlugin({
+      process: 'process/browser',
+      Buffer: ['buffer', 'Buffer']
+    })
+  ],
   devServer: {
     historyApiFallback: true,
     static: { directory: path.join(__dirname, '/') },