diff --git a/packages/devtools/client/components/ModuleItem.vue b/packages/devtools/client/components/ModuleItem.vue
index 9daa915c3..362eb14e1 100644
--- a/packages/devtools/client/components/ModuleItem.vue
+++ b/packages/devtools/client/components/ModuleItem.vue
@@ -5,24 +5,10 @@ const props = defineProps<{
   mod: InstalledModuleInfo
 }>()
 
-const config = useServerConfig()
-const isPackageModule = computed(() => props.mod.entryPath && isNodeModulePath(props.mod.entryPath))
-const name = computed(() => {
-  if (props.mod.meta?.name)
-    return props.mod.meta.name
-  if (props.mod.entryPath) {
-    return isPackageModule.value
-      ? getModuleNameFromPath(props.mod.entryPath)
-      : config.value?.rootDir
-        ? parseReadablePath(props.mod.entryPath, config.value?.rootDir).path
-        : ''
-  }
-  return ''
-})
 const staticInfo = computed(() => props.mod.info)
 const data = computed(() => ({
-  name,
   ...props.mod?.meta,
+  ...props.mod,
   ...staticInfo.value,
 }))
 </script>
diff --git a/packages/devtools/client/components/ModuleItemBase.vue b/packages/devtools/client/components/ModuleItemBase.vue
index 113540013..3eee989db 100644
--- a/packages/devtools/client/components/ModuleItemBase.vue
+++ b/packages/devtools/client/components/ModuleItemBase.vue
@@ -1,29 +1,15 @@
 <script setup lang="ts">
-import type { BasicModuleInfo, ModuleStaticInfo } from '../../src/types'
+import type { InstalledModuleInfo, ModuleStaticInfo } from '../../src/types'
 
 const props = defineProps<{
-  mod: BasicModuleInfo
+  mod: InstalledModuleInfo
   info?: ModuleStaticInfo
   compact?: boolean
 }>()
 
-const config = useServerConfig()
-const isPackageModule = computed(() => props.mod.entryPath && isNodeModulePath(props.mod.entryPath))
-const name = computed(() => {
-  if (props.mod.meta?.name)
-    return props.mod.meta.name
-  if (props.mod.entryPath) {
-    return isPackageModule.value
-      ? getModuleNameFromPath(props.mod.entryPath)
-      : config.value?.rootDir
-        ? parseReadablePath(props.mod.entryPath, config.value?.rootDir).path
-        : ''
-  }
-  return ''
-})
 const data = computed(() => ({
-  name,
   ...props.mod?.meta,
+  ...props.mod,
   ...props.info,
 }))
 
@@ -40,7 +26,7 @@ const openInEditor = useOpenInEditor()
     <div flex="~ col gap2" flex-auto of-hidden px1>
       <div gap-1t flex items-center text-ellipsis ws-nowrap text-lg>
         <NuxtLink
-          v-if="isPackageModule"
+          v-if="mod.isPackageModule"
           :to="npmBase + (data.npm || data.name)"
           target="_blank"
           hover="underline text-primary"
@@ -98,11 +84,11 @@ const openInEditor = useOpenInEditor()
     </div>
     <div flex="~ col" items-end>
       <div
-        v-if="data.icon || isPackageModule"
+        v-if="data.icon || mod.isPackageModule"
 
         h-20 w-20 flex flex-none rounded bg-gray:3 p4
       >
-        <img v-if="data.icon" :src="iconBase + data.icon" :alt="name" ma>
+        <img v-if="data.icon" :src="iconBase + data.icon" :alt="mod.name" ma>
         <div i-carbon-circle-dash ma text-4xl op50 />
       </div>
       <div v-if="data.maintainers?.length" flex="~" mt2 flex-auto items-end justify-end>
diff --git a/packages/devtools/client/composables/client.ts b/packages/devtools/client/composables/client.ts
index 665eab711..084e138eb 100644
--- a/packages/devtools/client/composables/client.ts
+++ b/packages/devtools/client/composables/client.ts
@@ -14,7 +14,7 @@ export function useClientRoute() {
   return computed(() => client.value?.nuxt.vueApp.config.globalProperties?.$route)
 }
 
-export function useClientRouter() {
+export function useClientRouter(): ComputedRef<ReturnType<typeof useRouter>> {
   const client = useClient()
   return computed(() => client.value?.nuxt.vueApp.config.globalProperties?.$router)
 }
diff --git a/packages/devtools/client/composables/state.ts b/packages/devtools/client/composables/state.ts
index 60434094a..ec275581b 100644
--- a/packages/devtools/client/composables/state.ts
+++ b/packages/devtools/client/composables/state.ts
@@ -43,7 +43,7 @@ export function useInstalledModules() {
             : undefined
 
         const isUninstallable = config.value?.modules?.includes(name)
-        const info = modules.value?.find(m => m.npm === name)
+        const info = modules.value?.find(m => m.npm === name) || modules.value?.find(m => m.name === name)
 
         return {
           name,
diff --git a/packages/devtools/client/pages/modules/modules.vue b/packages/devtools/client/pages/modules/modules.vue
index 0135e249e..f18dc9a9b 100644
--- a/packages/devtools/client/pages/modules/modules.vue
+++ b/packages/devtools/client/pages/modules/modules.vue
@@ -24,7 +24,7 @@ const userModules = computed(() => installedModules.value.filter(i => !i.isPacka
     >
       <ModuleItem
         v-for="m of packageModules"
-        :key="m.meta?.name || m.entryPath"
+        :key="m.name"
         :mod="m"
       />
       <NCard