diff --git a/desktop-dev/scripts/dnt.ts b/desktop-dev/scripts/dnt.ts
index 12998e270f..42df102964 100644
--- a/desktop-dev/scripts/dnt.ts
+++ b/desktop-dev/scripts/dnt.ts
@@ -26,7 +26,7 @@ await dnt.build({
   package: {
     // package.json properties
     name: "@dweb-browser/desktop-sdk",
-    version: Deno.args.filter((arg) => /^\d/.test(arg))[0],
+    version: Deno.args.filter((arg) => /^\d/.test(arg))[0] || "0.0.0",
     description: "Dweb Browser Development Kit",
     license: "MIT",
     config: {
@@ -67,6 +67,15 @@ await dnt.build({
         entry.writeJson(sourceMap);
       }
     }
+    const packageJson = JSON.parse(
+      fs.readFileSync("./electron/package.json", "utf-8")
+    );
+    packageJson.devDependencies.electron = packageJson.dependencies.electron;
+    delete packageJson.dependencies.electron;
+    fs.writeFileSync(
+      "./electron/package.json",
+      JSON.stringify(packageJson, null, 2)
+    );
 
     /// 启动
     new Deno.Command("pnpm", {
diff --git a/plaoc/cli/helper/flags-helper.ts b/plaoc/cli/helper/flags-helper.ts
index 20a1329173..496f20a75e 100644
--- a/plaoc/cli/helper/flags-helper.ts
+++ b/plaoc/cli/helper/flags-helper.ts
@@ -87,7 +87,7 @@ export class BundleFlagHelper {
       flags.mode === SERVE_MODE.LIVE ||
       (flags.mode === undefined &&
         bundleTarget !== undefined &&
-        /^http[s]:\/\//.test(bundleTarget))
+        /^http[s]{0,1}:\/\//.test(bundleTarget))
     ) {
       const liveUrl = bundleTarget;
       if (liveUrl === undefined) {
diff --git a/plaoc/cli/serve.ts b/plaoc/cli/serve.ts
index e5ab2aee3d..85391d82f1 100644
--- a/plaoc/cli/serve.ts
+++ b/plaoc/cli/serve.ts
@@ -11,7 +11,7 @@ import { staticServe } from "./helper/http-static-helper.ts";
 
 export const doServe = (args = Deno.args) => {
   const flags = Flags.parse(args, {
-    string: ["port", "mode","dir"],
+    string: ["port", "mode"],
     collect: ["metadata"],
     default: {
       port: 8096,
diff --git a/plaoc/scripts/npm.client.json b/plaoc/scripts/npm.client.json
index 8fcd7e6320..bc58207dd4 100644
--- a/plaoc/scripts/npm.client.json
+++ b/plaoc/scripts/npm.client.json
@@ -4,7 +4,7 @@
     "mainExports": ".",
     "buildToRootDir": "./build/client",
     "name": "@dweb-browser/plaoc",
-    "version": "0.0.6",
+    "version": "0.0.8",
     "lib": [
       "es2021",
       "dom"
diff --git a/plaoc/src/client/components/barcode-scanning/barcode-scanning.plugin.ts b/plaoc/src/client/components/barcode-scanning/barcode-scanning.plugin.ts
index 529ecb713e..ee4ae9e64d 100644
--- a/plaoc/src/client/components/barcode-scanning/barcode-scanning.plugin.ts
+++ b/plaoc/src/client/components/barcode-scanning/barcode-scanning.plugin.ts
@@ -5,8 +5,6 @@ import { BasePlugin } from "../base/BasePlugin.ts";
 import { SupportedFormat } from "./barcode-scanning.type.ts";
 
 export class BarcodeScannerPlugin extends BasePlugin {
-  readonly tagName = "dweb-barcode-scanning";
-
   constructor() {
     super("barcode-scanning.sys.dweb");
   }
diff --git a/plaoc/src/client/components/barcode-scanning/barcode-scanning.wc.ts b/plaoc/src/client/components/barcode-scanning/barcode-scanning.wc.ts
index e26a0d42ca..b29cfb9367 100644
--- a/plaoc/src/client/components/barcode-scanning/barcode-scanning.wc.ts
+++ b/plaoc/src/client/components/barcode-scanning/barcode-scanning.wc.ts
@@ -10,7 +10,8 @@ import {
 } from "./barcode-scanning.type.ts";
 
 export class HTMLDwebBarcodeScanningElement extends HTMLElement {
-  plugin = barcodeScannerPlugin;
+  static readonly tagName = "dweb-barcode-scanning";
+  readonly plugin = barcodeScannerPlugin;
 
   private _video: HTMLVideoElement | null = null;
   private _canvas: HTMLCanvasElement | null = null;
@@ -328,6 +329,11 @@ export class HTMLDwebBarcodeScanningElement extends HTMLElement {
 }
 
 customElements.define(
-  barcodeScannerPlugin.tagName,
+  HTMLDwebBarcodeScanningElement.tagName,
   HTMLDwebBarcodeScanningElement
 );
+declare global {
+  interface HTMLElementTagNameMap{
+    [HTMLDwebBarcodeScanningElement.tagName]: HTMLDwebBarcodeScanningElement
+  }
+}
diff --git a/plaoc/src/client/components/base/BasePlugin.ts b/plaoc/src/client/components/base/BasePlugin.ts
index e9f7aff064..c6c239b521 100644
--- a/plaoc/src/client/components/base/BasePlugin.ts
+++ b/plaoc/src/client/components/base/BasePlugin.ts
@@ -5,7 +5,6 @@ import { fetchExtends } from "../../helper/$makeFetchExtends.ts";
 import { createSignal } from "../../helper/createSignal.ts";
 
 export abstract class BasePlugin {
-  abstract tagName: string;
   static internal_url: string = globalThis.location?.href ?? "http://localhost";
   static public_url: Promise<string> | string = "";
   static internal_url_useable?: boolean;
diff --git a/plaoc/src/client/components/biometrics/biometrics.plugin.ts b/plaoc/src/client/components/biometrics/biometrics.plugin.ts
index 17c25860a7..1fb93a0167 100644
--- a/plaoc/src/client/components/biometrics/biometrics.plugin.ts
+++ b/plaoc/src/client/components/biometrics/biometrics.plugin.ts
@@ -3,7 +3,6 @@ import { BasePlugin } from "../base/BasePlugin.ts";
 import { BioetricsResult } from "./biometrics.type.ts";
 
 export class BiometricsPlugin extends BasePlugin {
-  readonly tagName = "dweb-biometrics";
   constructor() {
     super("biometrics.sys.dweb");
   }
diff --git a/plaoc/src/client/components/biometrics/biometrics.wc.ts b/plaoc/src/client/components/biometrics/biometrics.wc.ts
index 7d83254ed3..ff3dbd394a 100644
--- a/plaoc/src/client/components/biometrics/biometrics.wc.ts
+++ b/plaoc/src/client/components/biometrics/biometrics.wc.ts
@@ -2,7 +2,8 @@ import { cacheGetter } from "../../helper/cacheGetter.ts";
 import { biometricsPlugin } from "./biometrics.plugin.ts";
 
 export class HTMLDwebBiometricsElement extends HTMLElement {
-  plugin = biometricsPlugin;
+  static readonly tagName = "dweb-biometrics";
+  readonly plugin = biometricsPlugin;
 
   @cacheGetter()
   get check() {
@@ -15,4 +16,9 @@ export class HTMLDwebBiometricsElement extends HTMLElement {
   }
 }
 
-customElements.define(biometricsPlugin.tagName, HTMLDwebBiometricsElement);
+customElements.define(HTMLDwebBiometricsElement.tagName, HTMLDwebBiometricsElement);
+declare global {
+  interface HTMLElementTagNameMap{
+   [HTMLDwebBiometricsElement.tagName]: HTMLDwebBiometricsElement
+  }
+}
diff --git a/plaoc/src/client/components/clipboard/clipboard.plugin.ts b/plaoc/src/client/components/clipboard/clipboard.plugin.ts
index 38223cc2d0..3a60c05906 100644
--- a/plaoc/src/client/components/clipboard/clipboard.plugin.ts
+++ b/plaoc/src/client/components/clipboard/clipboard.plugin.ts
@@ -3,7 +3,6 @@ import { BasePlugin } from "../base/BasePlugin.ts";
 import type { ClipboardWriteOptions, ReadResult } from "./clipboard.type.ts";
 
 export class ClipboardPlugin extends BasePlugin {
-  readonly tagName = "dweb-clipboard";
   constructor() {
     super("clipboard.sys.dweb");
   }
diff --git a/plaoc/src/client/components/clipboard/clipboard.wc.ts b/plaoc/src/client/components/clipboard/clipboard.wc.ts
index 16fe88b1ef..754ba4b9de 100644
--- a/plaoc/src/client/components/clipboard/clipboard.wc.ts
+++ b/plaoc/src/client/components/clipboard/clipboard.wc.ts
@@ -2,6 +2,7 @@ import { cacheGetter } from "../../helper/cacheGetter.ts";
 import { clipboardPlugin } from "./clipboard.plugin.ts";
 
 export class HTMLDwebClipboardElement extends HTMLElement {
+  static readonly tagName = "dweb-clipboard";
   readonly plugin = clipboardPlugin;
 
   @cacheGetter()
@@ -15,4 +16,12 @@ export class HTMLDwebClipboardElement extends HTMLElement {
   }
 }
 
-customElements.define(clipboardPlugin.tagName, HTMLDwebClipboardElement);
+customElements.define(
+  HTMLDwebClipboardElement.tagName,
+  HTMLDwebClipboardElement
+);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebClipboardElement.tagName]: HTMLDwebClipboardElement;
+  }
+}
diff --git a/plaoc/src/client/components/config/config.plugin.ts b/plaoc/src/client/components/config/config.plugin.ts
index 2d3e1b5840..d18c08beb2 100644
--- a/plaoc/src/client/components/config/config.plugin.ts
+++ b/plaoc/src/client/components/config/config.plugin.ts
@@ -1,10 +1,22 @@
+/// <reference lib="dom"/>
 import { BasePlugin } from "../base/BasePlugin.ts";
 
 export class ConfigPlugin extends BasePlugin {
-  readonly tagName = "dweb-config";
   constructor() {
     super("internal");
+    if (typeof location === "object") {
+      this.initConfig();
+    }
+  }
+  initConfig(href = location.href) {
+    const searchParams = new URL(href).searchParams;
+    const internalUrl = searchParams.get("X-Plaoc-Internal-Url");
+    const publicUrl = searchParams.get("X-Plaoc-Public-Url");
+
+    publicUrl && this.setPublicUrl(publicUrl);
+    internalUrl && this.setInternalUrl(internalUrl);
   }
+
   getInternalUrl() {
     return BasePlugin.internal_url;
   }
diff --git a/plaoc/src/client/components/config/config.wc.ts b/plaoc/src/client/components/config/config.wc.ts
index 73d7af6d81..bc505c5c15 100644
--- a/plaoc/src/client/components/config/config.wc.ts
+++ b/plaoc/src/client/components/config/config.wc.ts
@@ -1,20 +1,11 @@
 import { configPlugin } from "./config.plugin.ts";
 
 export class HTMLDwebConfigElement extends HTMLElement {
+  static readonly tagName = "dweb-config";
   readonly plugin = configPlugin;
   get public_url() {
     return configPlugin.public_url;
   }
-
-  connectedCallback() {
-    const searchParams = new URL(location.href).searchParams;
-    const internalUrl = searchParams.get("X-Plaoc-Internal-Url");
-    const publicUrl = searchParams.get("X-Plaoc-Public-Url");
-
-    publicUrl && configPlugin.setPublicUrl(publicUrl);
-    internalUrl && configPlugin.setInternalUrl(internalUrl);
-  }
-
   getPublicUrl() {
     return configPlugin.updatePublicUrl();
   }
@@ -28,9 +19,9 @@ export class HTMLDwebConfigElement extends HTMLElement {
   }
 }
 
-// <dweb-config/>
-customElements.define(configPlugin.tagName, HTMLDwebConfigElement);
-// <meta is="dweb-config"/>
-// customElements.define(configPlugin.tagName, HTMLDwebConfigElement, {
-//   extends: "meta",
-// });
+customElements.define(HTMLDwebConfigElement.tagName, HTMLDwebConfigElement);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebConfigElement.tagName]: HTMLDwebConfigElement;
+  }
+}
diff --git a/plaoc/src/client/components/file-system/file-system.plugin.ts b/plaoc/src/client/components/file-system/file-system.plugin.ts
index 657a56d7d7..30946a8d42 100644
--- a/plaoc/src/client/components/file-system/file-system.plugin.ts
+++ b/plaoc/src/client/components/file-system/file-system.plugin.ts
@@ -8,7 +8,6 @@ import type {
 } from "./file-system.type.ts";
 
 export class FileSystemPlugin extends BasePlugin {
-  readonly tagName = "dweb-file-system";
   constructor() {
     super("file.sys.dweb");
   }
diff --git a/plaoc/src/client/components/file-system/file-system.wc.ts b/plaoc/src/client/components/file-system/file-system.wc.ts
index 083131cfab..fb21d16e58 100644
--- a/plaoc/src/client/components/file-system/file-system.wc.ts
+++ b/plaoc/src/client/components/file-system/file-system.wc.ts
@@ -1,6 +1,7 @@
 import { fileSystemPlugin } from "./file-system.plugin.ts";
 
 export class HTMLDwebFileSystemElement extends HTMLElement {
+  static readonly tagName = "dweb-file-system";
   readonly plugin = fileSystemPlugin;
 
   get writeFile() {
@@ -11,4 +12,9 @@ export class HTMLDwebFileSystemElement extends HTMLElement {
   }
 }
 
-customElements.define(fileSystemPlugin.tagName, HTMLDwebFileSystemElement);
+customElements.define(HTMLDwebFileSystemElement.tagName, HTMLDwebFileSystemElement);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebFileSystemElement.tagName]: HTMLDwebFileSystemElement;
+  }
+}
diff --git a/plaoc/src/client/components/haptics/haptics.plugin.ts b/plaoc/src/client/components/haptics/haptics.plugin.ts
index cc902406a1..876a9e8cf0 100644
--- a/plaoc/src/client/components/haptics/haptics.plugin.ts
+++ b/plaoc/src/client/components/haptics/haptics.plugin.ts
@@ -7,7 +7,6 @@ import type {
 } from "./haptics.type.ts";
 
 export class HapticsPlugin extends BasePlugin {
-  readonly tagName = "dweb-haptics";
   constructor() {
     super("haptics.sys.dweb");
   }
diff --git a/plaoc/src/client/components/haptics/haptics.wc.ts b/plaoc/src/client/components/haptics/haptics.wc.ts
index 52708ef8ae..8fcfa30c11 100644
--- a/plaoc/src/client/components/haptics/haptics.wc.ts
+++ b/plaoc/src/client/components/haptics/haptics.wc.ts
@@ -2,6 +2,7 @@ import { cacheGetter } from "../../helper/cacheGetter.ts";
 import { hapticsPlugin } from "./haptics.plugin.ts";
 
 export class HTMLDwebHapticsElement extends HTMLElement {
+  static readonly tagName = "dweb-haptics";
   readonly plugin = hapticsPlugin;
 
   @cacheGetter()
@@ -45,4 +46,9 @@ export class HTMLDwebHapticsElement extends HTMLElement {
   }
 }
 
-customElements.define(hapticsPlugin.tagName, HTMLDwebHapticsElement);
+customElements.define(HTMLDwebHapticsElement.tagName, HTMLDwebHapticsElement);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebHapticsElement.tagName]: HTMLDwebHapticsElement;
+  }
+}
diff --git a/plaoc/src/client/components/navigation-bar/navigation-bar.plugin.ts b/plaoc/src/client/components/navigation-bar/navigation-bar.plugin.ts
index 6f71a7a3e2..0dfa807053 100644
--- a/plaoc/src/client/components/navigation-bar/navigation-bar.plugin.ts
+++ b/plaoc/src/client/components/navigation-bar/navigation-bar.plugin.ts
@@ -20,8 +20,6 @@ export class NavigationBarPlugin extends BarPlugin<
   $NavigationBarState,
   $NavigationBarWritableState
 > {
-  readonly tagName = "dweb-navigation-bar";
-
   constructor() {
     super("navigation-bar.nativeui.browser.dweb");
   }
diff --git a/plaoc/src/client/components/navigation-bar/navigation-bar.wc.ts b/plaoc/src/client/components/navigation-bar/navigation-bar.wc.ts
index 2d5474e90a..8de824d932 100644
--- a/plaoc/src/client/components/navigation-bar/navigation-bar.wc.ts
+++ b/plaoc/src/client/components/navigation-bar/navigation-bar.wc.ts
@@ -10,10 +10,11 @@ export class HTMLDwebNavigationBarElement extends HTMLStateObserverElement<
   $NavigationBarRawState,
   $NavigationBarState
 > {
+  static readonly tagName = "dweb-navigation-bar";
+  readonly plugin = navigationBarPlugin;
   constructor() {
     super(navigationBarPlugin.state);
   }
-  readonly plugin = navigationBarPlugin;
   @cacheGetter()
   get setColor() {
     return navigationBarPlugin.setColor;
@@ -61,6 +62,12 @@ export class HTMLDwebNavigationBarElement extends HTMLStateObserverElement<
 }
 
 customElements.define(
-  navigationBarPlugin.tagName,
+  HTMLDwebNavigationBarElement.tagName,
   HTMLDwebNavigationBarElement
 );
+
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebNavigationBarElement.tagName]: HTMLDwebNavigationBarElement;
+  }
+}
diff --git a/plaoc/src/client/components/network/network.plugin.ts b/plaoc/src/client/components/network/network.plugin.ts
index 3cee7e640c..6cf5d6c9a7 100644
--- a/plaoc/src/client/components/network/network.plugin.ts
+++ b/plaoc/src/client/components/network/network.plugin.ts
@@ -24,8 +24,6 @@ const _network_status: Tkit = {
 };
 
 export class NetworkPlugin extends BaseEvent<keyof NetworkStatusMap> {
-  readonly tagName = "dweb-network";
-
   constructor() {
     super(_network_status);
     if (typeof window !== "undefined") {
diff --git a/plaoc/src/client/components/network/network.wc.ts b/plaoc/src/client/components/network/network.wc.ts
index f9ecba7ace..34bd1340c8 100644
--- a/plaoc/src/client/components/network/network.wc.ts
+++ b/plaoc/src/client/components/network/network.wc.ts
@@ -3,7 +3,8 @@ import { cacheGetter } from "../../helper/cacheGetter.ts";
 import { networkPlugin } from "./network.plugin.ts";
 
 export class HTMLDwebNetworkElement extends HTMLElement {
-  plugin = networkPlugin;
+  static readonly tagName = "dweb-network";
+  readonly plugin = networkPlugin;
 
   @cacheGetter()
   get getStatus() {
@@ -16,4 +17,9 @@ export class HTMLDwebNetworkElement extends HTMLElement {
   }
 }
 
-customElements.define(networkPlugin.tagName, HTMLDwebNetworkElement);
+customElements.define(HTMLDwebNetworkElement.tagName, HTMLDwebNetworkElement);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebNetworkElement.tagName]: HTMLDwebNetworkElement;
+  }
+}
diff --git a/plaoc/src/client/components/safe-area/safe-area.plugin.ts b/plaoc/src/client/components/safe-area/safe-area.plugin.ts
index caedc0ff47..fb8981b445 100644
--- a/plaoc/src/client/components/safe-area/safe-area.plugin.ts
+++ b/plaoc/src/client/components/safe-area/safe-area.plugin.ts
@@ -13,7 +13,6 @@ export class SafeAreaPlugin extends InsetsPlugin<
   $SafeAreaState,
   $SafeAreaWritableState
 > {
-  readonly tagName = "dweb-safe-area";
   constructor() {
     super("safe-area.nativeui.browser.dweb");
   }
diff --git a/plaoc/src/client/components/safe-area/safe-area.wc.ts b/plaoc/src/client/components/safe-area/safe-area.wc.ts
index a5bab96577..8cb1c762b4 100644
--- a/plaoc/src/client/components/safe-area/safe-area.wc.ts
+++ b/plaoc/src/client/components/safe-area/safe-area.wc.ts
@@ -7,6 +7,8 @@ export class HTMLDwebSafeAreaElement extends HTMLStateObserverElement<
   $SafeAreaRawState,
   $SafeAreaState
 > {
+  static readonly tagName = "dweb-safe-area";
+  readonly plugin = safeAreaPlugin;
   constructor() {
     super(safeAreaPlugin.state);
   }
@@ -27,4 +29,10 @@ export class HTMLDwebSafeAreaElement extends HTMLStateObserverElement<
     return safeAreaPlugin.getOverlay;
   }
 }
-customElements.define(safeAreaPlugin.tagName, HTMLDwebSafeAreaElement);
+customElements.define(HTMLDwebSafeAreaElement.tagName, HTMLDwebSafeAreaElement);
+
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebSafeAreaElement.tagName]: HTMLDwebSafeAreaElement;
+  }
+}
diff --git a/plaoc/src/client/components/share/share.plugin.ts b/plaoc/src/client/components/share/share.plugin.ts
index 327b6f572e..8dffefe304 100644
--- a/plaoc/src/client/components/share/share.plugin.ts
+++ b/plaoc/src/client/components/share/share.plugin.ts
@@ -2,7 +2,6 @@ import { bindThis } from "../../helper/bindThis.ts";
 import { BasePlugin } from "../base/BasePlugin.ts";
 import type { ShareOptions, ShareResult } from "./share.type.ts";
 export class SharePlugin extends BasePlugin {
-  readonly tagName = "dweb-share";
 
   constructor() {
     super("share.sys.dweb");
diff --git a/plaoc/src/client/components/share/share.wc.ts b/plaoc/src/client/components/share/share.wc.ts
index 2d199f4554..dcd03ef161 100644
--- a/plaoc/src/client/components/share/share.wc.ts
+++ b/plaoc/src/client/components/share/share.wc.ts
@@ -1,6 +1,7 @@
 import { sharePlugin } from "./share.plugin.ts";
 
 export class HTMLDwebShareElement extends HTMLElement {
+  static readonly tagName = "dweb-share";
   readonly plugin = sharePlugin;
 
   get canShare() {
@@ -11,4 +12,9 @@ export class HTMLDwebShareElement extends HTMLElement {
   }
 }
 
-customElements.define(sharePlugin.tagName, HTMLDwebShareElement);
+customElements.define(HTMLDwebShareElement.tagName, HTMLDwebShareElement);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebShareElement.tagName]: HTMLDwebShareElement;
+  }
+}
diff --git a/plaoc/src/client/components/splash-screen/splash-screen.plugin.ts b/plaoc/src/client/components/splash-screen/splash-screen.plugin.ts
index ed49e5c555..a3764bc9fb 100644
--- a/plaoc/src/client/components/splash-screen/splash-screen.plugin.ts
+++ b/plaoc/src/client/components/splash-screen/splash-screen.plugin.ts
@@ -6,7 +6,6 @@ import type {
 } from "./splash-screen.type.ts";
 
 export class SplashScreenPlugin extends BasePlugin {
-  readonly tagName = "dweb-splash-screen";
   constructor() {
     super("splash-screen.nativeui.browser.dweb");
   }
diff --git a/plaoc/src/client/components/splash-screen/splash-screen.wc.ts b/plaoc/src/client/components/splash-screen/splash-screen.wc.ts
index 44c53e6e1f..043930d51f 100644
--- a/plaoc/src/client/components/splash-screen/splash-screen.wc.ts
+++ b/plaoc/src/client/components/splash-screen/splash-screen.wc.ts
@@ -1,6 +1,7 @@
 import { cacheGetter } from "../../helper/cacheGetter.ts";
 import { splashScreenPlugin } from "./splash-screen.plugin.ts";
 export class HTMLDwebSplashScreenElement extends HTMLElement {
+  static readonly tagName = "dweb-splash-screen";
   readonly plugin = splashScreenPlugin;
 
   @cacheGetter()
@@ -14,4 +15,12 @@ export class HTMLDwebSplashScreenElement extends HTMLElement {
   }
 }
 
-customElements.define(splashScreenPlugin.tagName, HTMLDwebSplashScreenElement);
+customElements.define(
+  HTMLDwebSplashScreenElement.tagName,
+  HTMLDwebSplashScreenElement
+);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebSplashScreenElement.tagName]: HTMLDwebSplashScreenElement;
+  }
+}
diff --git a/plaoc/src/client/components/status-bar/status-bar.plugin.ts b/plaoc/src/client/components/status-bar/status-bar.plugin.ts
index 916849a1cb..a3747af255 100644
--- a/plaoc/src/client/components/status-bar/status-bar.plugin.ts
+++ b/plaoc/src/client/components/status-bar/status-bar.plugin.ts
@@ -19,8 +19,6 @@ export class StatusBarPlugin extends BarPlugin<
   $StatusBarState,
   $StatusBarWritableState
 > {
-  readonly tagName = "dweb-status-bar";
-
   constructor() {
     super("status-bar.nativeui.browser.dweb");
   }
diff --git a/plaoc/src/client/components/status-bar/status-bar.wc.ts b/plaoc/src/client/components/status-bar/status-bar.wc.ts
index e2ed2ad9cd..720c2c29f9 100644
--- a/plaoc/src/client/components/status-bar/status-bar.wc.ts
+++ b/plaoc/src/client/components/status-bar/status-bar.wc.ts
@@ -7,10 +7,11 @@ export class HTMLDwebStatusBarElement extends HTMLStateObserverElement<
   $StatusBarRawState,
   $StatusBarState
 > {
+  static readonly tagName = "dweb-status-bar";
+  readonly plugin = statusBarPlugin;
   constructor() {
     super(statusBarPlugin.state);
   }
-  readonly plugin = statusBarPlugin;
   @cacheGetter()
   get setColor() {
     return statusBarPlugin.setColor;
@@ -57,4 +58,13 @@ export class HTMLDwebStatusBarElement extends HTMLStateObserverElement<
   }
 }
 
-customElements.define(statusBarPlugin.tagName, HTMLDwebStatusBarElement);
+customElements.define(
+  HTMLDwebStatusBarElement.tagName,
+  HTMLDwebStatusBarElement
+);
+
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebStatusBarElement.tagName]: HTMLDwebStatusBarElement;
+  }
+}
diff --git a/plaoc/src/client/components/toast/toast.plugin.ts b/plaoc/src/client/components/toast/toast.plugin.ts
index 4ec24f7f1e..7ff5585d77 100644
--- a/plaoc/src/client/components/toast/toast.plugin.ts
+++ b/plaoc/src/client/components/toast/toast.plugin.ts
@@ -6,8 +6,6 @@ import type { ToastShowOptions } from "./toast.type.ts";
  * 访问 toast 能力的插件
  */
 export class ToastPlugin extends BasePlugin {
-  readonly tagName = "dweb-toast";
-
   constructor() {
     super("toast.sys.dweb");
   }
diff --git a/plaoc/src/client/components/toast/toast.wc.ts b/plaoc/src/client/components/toast/toast.wc.ts
index 3f0c62dede..74c64004df 100644
--- a/plaoc/src/client/components/toast/toast.wc.ts
+++ b/plaoc/src/client/components/toast/toast.wc.ts
@@ -2,6 +2,7 @@ import { cacheGetter } from "../../helper/cacheGetter.ts";
 import { toastPlugin } from "./toast.plugin.ts";
 
 export class HTMLDwebToastElement extends HTMLElement {
+  static readonly tagName = "dweb-toast";
   readonly plugin = toastPlugin;
 
   @cacheGetter()
@@ -9,4 +10,9 @@ export class HTMLDwebToastElement extends HTMLElement {
     return toastPlugin.show;
   }
 }
-customElements.define(toastPlugin.tagName, HTMLDwebToastElement);
+customElements.define(HTMLDwebToastElement.tagName, HTMLDwebToastElement);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebToastElement.tagName]: HTMLDwebToastElement;
+  }
+}
diff --git a/plaoc/src/client/components/torch/torch.plugin.ts b/plaoc/src/client/components/torch/torch.plugin.ts
index b3bb5211e9..7b5810133e 100644
--- a/plaoc/src/client/components/torch/torch.plugin.ts
+++ b/plaoc/src/client/components/torch/torch.plugin.ts
@@ -4,7 +4,6 @@ import { BasePlugin } from "../base/BasePlugin.ts";
  * TODO 挪到 nativeui 中控制
  */
 export class TorchPlugin extends BasePlugin {
-  readonly tagName = "dweb-torch";
   constructor() {
     super("torch.nativeui.browser.dweb");
   }
diff --git a/plaoc/src/client/components/torch/torch.wc.ts b/plaoc/src/client/components/torch/torch.wc.ts
index f9c86e4626..deaf5f354f 100644
--- a/plaoc/src/client/components/torch/torch.wc.ts
+++ b/plaoc/src/client/components/torch/torch.wc.ts
@@ -2,6 +2,7 @@ import { cacheGetter } from "../../helper/cacheGetter.ts";
 import { torchPlugin } from "./torch.plugin.ts";
 
 export class HTMLDwebTorchElement extends HTMLElement {
+  static readonly tagName = "dweb-torch";
   readonly plugin = torchPlugin;
 
   @cacheGetter()
@@ -13,4 +14,9 @@ export class HTMLDwebTorchElement extends HTMLElement {
     return torchPlugin.getTorchState;
   }
 }
-customElements.define(torchPlugin.tagName, HTMLDwebTorchElement);
+customElements.define(HTMLDwebTorchElement.tagName, HTMLDwebTorchElement);
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebTorchElement.tagName]: HTMLDwebTorchElement;
+  }
+}
diff --git a/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.plugin.ts b/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.plugin.ts
index 628aa5ddc5..e4b6ce658b 100644
--- a/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.plugin.ts
+++ b/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.plugin.ts
@@ -12,7 +12,6 @@ export class VirtualKeyboardPlugin extends InsetsPlugin<
   $VirtualKeyboardState,
   $VirtualKeyboardWritableState
 > {
-  readonly tagName = "dweb-virtual-keyboard";
   constructor() {
     super("virtual-keyboard.nativeui.browser.dweb");
   }
diff --git a/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.wc.ts b/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.wc.ts
index 1f599237c0..e6b95afe3b 100644
--- a/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.wc.ts
+++ b/plaoc/src/client/components/virtual-keyboard/virtual-keyboard.wc.ts
@@ -10,6 +10,8 @@ export class HTMLDwebVirtualKeyboardElement extends HTMLStateObserverElement<
   $VirtualKeyboardRawState,
   $VirtualKeyboardState
 > {
+  static readonly tagName = "dweb-virtual-keyboard";
+  readonly plugin = virtualKeyboardPlugin;
   constructor() {
     super(virtualKeyboardPlugin.state);
   }
@@ -31,6 +33,11 @@ export class HTMLDwebVirtualKeyboardElement extends HTMLStateObserverElement<
   }
 }
 customElements.define(
-  virtualKeyboardPlugin.tagName,
+  HTMLDwebVirtualKeyboardElement.tagName,
   HTMLDwebVirtualKeyboardElement
 );
+declare global {
+  interface HTMLElementTagNameMap {
+    [HTMLDwebVirtualKeyboardElement.tagName]: HTMLDwebVirtualKeyboardElement;
+  }
+}