refactor: remove env configs from vite settings (#3185)

reown-com · Nov 1, 2024 · 2450a3e · 2450a3e
1 parent 458b590
commit 2450a3e
Show file tree

Hide file tree

Showing 3 changed files with 68 additions and 84 deletions.
diff --git a/examples/vue-ethers5/vite.config.ts b/examples/vue-ethers5/vite.config.ts
@@ -2,8 +2,5 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 
 export default defineConfig({
-  plugins: [vue()],
-  define: {
-    'import.meta.env.VITE_PROJECT_ID': JSON.stringify(process.env.VITE_PROJECT_ID)
-  }
+  plugins: [vue()]
 })
diff --git a/examples/vue-solana/src/App.vue b/examples/vue-solana/src/App.vue
@@ -1,40 +1,82 @@
-<script lang="ts" setup>
-import { ref, onMounted } from 'vue'
-import { solana, solanaTestnet, solanaDevnet } from '@reown/appkit/networks'
-import { createAppKit, useAppKitEvents, useAppKitState, useAppKitTheme } from '@reown/appkit/vue'
-import { SolanaAdapter } from '@reown/appkit-adapter-solana'
+<template>
+  <div class="container">
+    <h1>Vue Solana Example</h1>
+
+    <!-- AppKit UI Components -->
+    <div class="button-group">
+      <w3m-button />
+      <w3m-network-button />
+    </div>
+
+    <!-- Modal Controls -->
+    <div class="button-group">
+      <button @click="modal.open()">Open Connect Modal</button>
+      <button @click="modal.open({ view: 'Networks' })">Open Network Modal</button>
+      <button @click="toggleTheme">Toggle Theme Mode</button>
+    </div>
+
+    <!-- State Displays -->
+    <div class="state-container">
+      <section>
+        <h2>Account</h2>
+        <pre>{{ JSON.stringify(accountState, null, 2) }}</pre>
+      </section>
+
+      <section>
+        <h2>Network</h2>
+        <pre>{{ JSON.stringify(networkState, null, 2) }}</pre>
+      </section>
+
+      <section>
+        <h2>State</h2>
+        <pre>{{ JSON.stringify(appState, null, 2) }}</pre>
+      </section>
+
+      <section>
+        <h2>Theme</h2>
+        <pre>{{ JSON.stringify(themeState, null, 2) }}</pre>
+      </section>
+
+      <section>
+        <h2>Events</h2>
+        <pre>{{ JSON.stringify(events, null, 2) }}</pre>
+      </section>
+
+      <section>
+        <h2>Wallet Info</h2>
+        <pre>{{ JSON.stringify(walletInfo, null, 2) }}</pre>
+      </section>
+    </div>
+  </div>
+</template>
+
+<script language="ts" setup>
+import { ref, onMounted, watch } from 'vue'
 import {
-  PhantomWalletAdapter,
-  HuobiWalletAdapter,
-  SolflareWalletAdapter,
-  TrustWalletAdapter
-} from '@solana/wallet-adapter-wallets'
-import { BackpackWalletAdapter } from '@solana/wallet-adapter-backpack'
+  createAppKit,
+  useAppKit,
+  useAppKitState,
+  useAppKitTheme,
+  useAppKitEvents
+} from '@reown/appkit/vue'
+import { SolanaAdapter } from '@reown/appkit-adapter-solana'
+import { solana, solanaTestnet } from '@reown/appkit/networks'
 
 const projectId = import.meta.env.VITE_PROJECT_ID
 if (!projectId) {
   throw new Error('VITE_PROJECT_ID is not set')
 }
 
-// Initialize Solana adapter
-const solanaAdapter = new SolanaAdapter({
-  wallets: [
-    new HuobiWalletAdapter(),
-    new PhantomWalletAdapter(),
-    new SolflareWalletAdapter(),
-    new TrustWalletAdapter(),
-    new BackpackWalletAdapter()
-  ]
-})
+const solanaAdapter = new SolanaAdapter({})
 
 // Initialize AppKit
 const modal = createAppKit({
   adapters: [solanaAdapter],
-  networks: [solana, solanaTestnet, solanaDevnet],
+  networks: [solana, solanaTestnet],
   projectId,
   metadata: {
-    name: 'AppKit Vue Solana Example',
-    description: 'AppKit Vue Solana Example',
+    name: 'AppKit Vue Example',
+    description: 'AppKit Vue Example',
     url: 'https://reown.com/appkit',
     icons: ['https://avatars.githubusercontent.com/u/179229932?s=200&v=4']
   }
@@ -83,58 +125,6 @@ onMounted(() => {
 })
 </script>
 
-<template>
-  <div class="container">
-    <h1>Vue Solana Example</h1>
-
-    <!-- AppKit UI Components -->
-    <div class="button-group">
-      <w3m-button />
-      <w3m-network-button />
-    </div>
-
-    <!-- Modal Controls -->
-    <div class="button-group">
-      <button @click="modal.open()">Open Connect Modal</button>
-      <button @click="modal.open({ view: 'Networks' })">Open Network Modal</button>
-      <button @click="toggleTheme">Toggle Theme Mode</button>
-    </div>
-
-    <!-- State Displays -->
-    <div class="state-container">
-      <section>
-        <h2>Account</h2>
-        <pre>{{ JSON.stringify(accountState, null, 2) }}</pre>
-      </section>
-
-      <section>
-        <h2>Network</h2>
-        <pre>{{ JSON.stringify(networkState, null, 2) }}</pre>
-      </section>
-
-      <section>
-        <h2>State</h2>
-        <pre>{{ JSON.stringify(appState, null, 2) }}</pre>
-      </section>
-
-      <section>
-        <h2>Theme</h2>
-        <pre>{{ JSON.stringify(themeState, null, 2) }}</pre>
-      </section>
-
-      <section>
-        <h2>Events</h2>
-        <pre>{{ JSON.stringify(events, null, 2) }}</pre>
-      </section>
-
-      <section>
-        <h2>Wallet Info</h2>
-        <pre>{{ JSON.stringify(walletInfo, null, 2) }}</pre>
-      </section>
-    </div>
-  </div>
-</template>
-
 <style>
 /* Base styles */
 body {

diff --git a/examples/vue-solana/vite.config.ts b/examples/vue-solana/vite.config.ts
@@ -2,8 +2,5 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 
 export default defineConfig({
-  plugins: [vue()],
-  define: {
-    'import.meta.env.VITE_PROJECT_ID': JSON.stringify(process.env.VITE_PROJECT_ID)
-  }
+  plugins: [vue()]
 })