feat: @uni-helper/devtools-types

packages/cli/src/commands/client.ts

@@ -5,7 +5,10 @@ export function open(port: string) {
   const window = app.createBrowserWindow({
     title: 'Uni Devtools',
     alwaysOnTop: true,
+    width: 1600,
+    height: 900,
   })
+  console.log(window.getCurrentMonitor())
   window.createWebview({
     url: `http://localhost:${port}`,
     enableDevtools: false,

packages/client/package.json

@@ -25,6 +25,7 @@
   "dependencies": {
     "@trpc/client": "^10.45.2",
     "@uni-helper/devtools-shared": "workspace:*",
+    "@uni-helper/devtools-types": "workspace:*",
     "@vue/devtools-kit": "^7.3.6",
     "@vue/devtools-ui": "^7.3.4",
     "@vueuse/core": "^10.9.0",

packages/client/src/App.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-const { init } = useInitState()
+const { init, loading } = useInitState()
 init()
 const router = useRouter()
 const clientState = devtoolsClientState
@@ -10,9 +10,11 @@ if (clientState.value.route !== '/')
 <template>
   <main fixed inset-0 h-screen w-screen>
     <Suspense>
+      <AppConnecting v-if="loading" />
       <div
-        :class="clientState.isFirstVisit ? 'flex' : 'grid grid-cols-[50px_1fr]'"
-        h-full h-screen of-hidden font-sans bg-base
+        v-else
+        :class="clientState.isFirstVisit ? 'flex' : 'grid grid-cols-[50px_1fr]'" h-full h-screen of-hidden font-sans
+        bg-base
       >
         <SideNav v-if="!clientState.isFirstVisit" of-x-hidden of-y-auto />
         <RouterView v-slot="{ Component }">
@@ -21,9 +23,6 @@ if (clientState.value.route !== '/')
           </KeepAlive>
         </RouterView>
       </div>
-      <template #fallback>
-        <AppConnecting />
-      </template>
     </Suspense>
   </main>
 </template>

packages/client/src/stores/init.ts

@@ -1,28 +1,21 @@
-// import { decompressURLQuery } from '@uni-helper/devtools-shared'
-import type { InitState } from '~/types'
+import type { InitState } from '@uni-helper/devtools-types'
 
 export const useInitState = createGlobalState(
   () => {
-    const initState = ref<InitState | object>({})
+    const initState = ref<InitState>()
+    const loading = ref(false)
     function init() {
-      // const params = new URLSearchParams(window.location.search)
-      // const data = params.get('data')
-      // if (!data)
-      //   return
-      // initState.value = decompressURLQuery(data)
-      // console.log('initState', initState.value)
       trpc.onVersion.subscribe(undefined, {
         onData: (data) => {
-          initState.value!.vueVersion = data.vueVersion
-          initState.value!.uniCompileVersion = data.uniVersion
-          console.log('initState', initState.value)
+          initState.value = data
         },
       })
     }
 
     return {
-      initState,
       init,
+      loading,
+      initState,
     }
   },
 )

packages/client/src/types/index.d.ts

@@ -16,11 +16,8 @@ export interface InitState {
   /** 当前页面 */
   currentPage: string
 
-  /** uni编译版本 */
-  uniCompileVersion: string
-
   /** uni运行版本 */
-  uniRuntimeVersion: string
+  uniVersion: string
 
   /** 当前运行平台 */
   uniPlatform: string

packages/plugin/inspect/initMPClient.js

@@ -7,14 +7,15 @@ export function initMPClient() {
 }
 
 function sendVersion() {
-  const { uniRuntimeVersion } = uni.getSystemInfoSync()
+  const { uniRuntimeVersion, uniPlatform } = uni.getSystemInfoSync()
 
   const vueVersion = version
   const uniVersion = uniRuntimeVersion
 
   trpc.sendVersion.subscribe({
     vueVersion,
     uniVersion,
+    uniPlatform,
   }, {
     onComplete: () => {},
   })

packages/plugin/package.json

@@ -60,6 +60,7 @@
   "dependencies": {
     "@trpc/server": "^10.45.2",
     "@uni-helper/devtools-shared": "workspace:*",
+    "@uni-helper/devtools-types": "workspace:*",
     "@uni-helper/trpc-client": "workspace:*",
     "@uni-helper/uni-env": "^0.1.1",
     "@vue/compiler-sfc": "^3.4.27",

packages/plugin/src/devtoolServer/rpc/version.ts

@@ -1,13 +1,9 @@
 import type { EventEmitter } from 'node:stream'
 import { z } from 'zod'
 import { observable } from '@trpc/server/observable'
+import type { InitState } from '@uni-helper/devtools-types'
 import { publicProcedure, router } from './../trpc'
 
-interface Version {
-  vueVersion: string
-  uniVersion: string
-}
-
 export function versionRouter(eventEmitter: EventEmitter) {
   const { input, subscription } = publicProcedure
 
@@ -16,13 +12,14 @@ export function versionRouter(eventEmitter: EventEmitter) {
       z.object({
         vueVersion: z.string(),
         uniVersion: z.string(),
+        uniPlatform: z.string(),
       }),
     ).subscription(({ input }) => {
       eventEmitter.emit('version', input)
     }),
     onVersion: subscription(() => {
-      return observable<Version>((emit) => {
-        const versionHandler = (data: Version) => {
+      return observable<InitState>((emit) => {
+        const versionHandler = (data: InitState) => {
           emit.next(data)
         }
 

packages/types/index.d.ts

@@ -0,0 +1,33 @@
+export interface ModuleInfo {
+  id: string
+  plugins: { name: string, transform?: number, resolveId?: number }[]
+  deps: string[]
+  virtual: boolean
+}
+
+export interface ComponentTreeNode {
+  name: string
+  file: string
+  children?: ComponentTreeNode[]
+}
+
+/** 初始化状态 */
+export interface InitState {
+  /** 当前页面 */
+  currentPage: string
+
+  /** uni运行版本 */
+  uniVersion: string
+
+  /** 当前运行平台 */
+  uniPlatform: string
+
+  /** vue版本 */
+  vueVersion: string
+
+  /** 当前页面组件 */
+  components: ComponentTreeNode
+
+  /** pinia数据 */
+  piniaState: { [key: string]: any }
+}

packages/types/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "@uni-helper/devtools-types",
+  "version": "1.0.0",
+  "description": "",
+  "author": "",
+  "license": "ISC",
+  "keywords": [],
+  "main": "index.d.ts"
+}