package.json

@@ -46,7 +46,7 @@
     "webm-duration-fix-buffer": "^1.0.0",
     "winreg": "^1.2.5"
   },
-  "devDependencies": { 
+  "devDependencies": {
     "@types/react": "^18.0.0",
     "@types/react-dom": "^17.0.25",
     "@vitejs/plugin-react": "^1.0.7",
@@ -91,7 +91,15 @@
     "directories": {
       "output": "electron"
     },
-    "extraResources": [],
+    "extraResources": [
+      {
+        "from": "src/assets/virtualBackground",
+        "to": "images",
+        "filter": [
+          "**/*"
+        ]
+      }
+    ],
     "nsis": {
       "oneClick": false,
       "installerIcon": "build/install.ico",

src/components/StupWizard/index.tsx

@@ -233,14 +233,23 @@ const VideoComponents = () => {
     }, [darkLightEnhancement]);
     useEffect(() => {
         if (typeof virtualBackground.sourceIndex === 'number') {
-            window.electron.getAppPath().then((res: string) => {
+            if (import.meta.env.VITE_ENV === 'development') {
-                const imagePath = path.join(res, 'src', 'assets', 'virtualBackground', `${virtualBackground.sourceIndex + 1}.png`);
+                window.electron.getAppPath().then((res: string) => {
+                    const imagePath = path.join(res, 'src', 'assets', 'virtualBackground', `${virtualBackground.sourceIndex + 1}.png`);
+                    agora.enableVirtualBackground(virtualBackground.isVirtualBackground, {
+                        source: imagePath,
+                        background_source_type: 2,
+                        color: Number(virtualBackground.color),
+                    })
+                })
+            } else {
+                const imagePath = path.join((process as any).resourcesPath, 'images', `${virtualBackground.sourceIndex + 1}.png`);
                 agora.enableVirtualBackground(virtualBackground.isVirtualBackground, {
                     source: imagePath,
                     background_source_type: 2,
                     color: Number(virtualBackground.color),
                 })
-            })
+            }
         } else {
             agora.enableVirtualBackground(virtualBackground.isVirtualBackground, {
                 background_source_type: 1,

src/utils/package/agora.ts

@@ -120,14 +120,23 @@ export const agora = {
       agora.setLowlightEnhanceOptions(settingData.darkLightEnhancement.isDarkLightEnhancement, settingData.darkLightEnhancement)
       console.log(settingData);
       if (typeof settingData.virtualBackground.sourceIndex === 'number') {
-        window.electron.getAppPath().then((res: string) => {
+        if (import.meta.env.VITE_ENV === 'development') {
-          const imagePath = path.join(res, 'src', 'assets', 'virtualBackground', `${settingData.virtualBackground.sourceIndex + 1}.png`);
+          window.electron.getAppPath().then((res: string) => {
+            const imagePath = path.join(res, 'src', 'assets', 'virtualBackground', `${settingData.virtualBackground.sourceIndex + 1}.png`);
+            agora.enableVirtualBackground(settingData.virtualBackground.isVirtualBackground, {
+              source: imagePath,
+              background_source_type: 2,
+              color: Number(settingData.virtualBackground.color),
+            })
+          })
+        } else {
+          const imagePath = path.join((process as any).resourcesPath, 'images', `${settingData.virtualBackground.sourceIndex + 1}.png`);
           agora.enableVirtualBackground(settingData.virtualBackground.isVirtualBackground, {
             source: imagePath,
             background_source_type: 2,
             color: Number(settingData.virtualBackground.color),
           })
-        })
+        }
       } else {
         agora.enableVirtualBackground(settingData.virtualBackground.isVirtualBackground, {
           background_source_type: 1,