kunsam-three-debugger v0.0.5

使用

import { KunsamThreeDebuggerBase, KunsamThreeDebugger } from './debug'
import { KunsamVueDebugger } from 'kunsam-react-debugger'
import type { ParametricApp } from '@/features/ParametricApp/parametric.app'

export type ParametricAppDebugger = KunsamThreeDebuggerBase<ParametricApp>

export const DEBUG_APP: ParametricAppDebugger = new KunsamThreeDebuggerBase<ParametricApp>({
  logOption: {
    root: 'src',
    level: 2,
    exclude: []
  },
  storageKey: {
    consoleLog: '__DEBUG_LOG__',
    debugEnable: '__DEBUG_MODE_ENABLED__',
    debugState: '__DEBUG_STATE__',
    consoleLogState: '__DEBUG_LOG_STATE__'
  },
  threejs: {
    getRenderer(app) {
      return app.canvas.renderer
    },
    getScene(app) {
      return app.canvas.scene
    },
    getCamera(app) {
      return app.canvas.Base_Control.camera
    },
    addToAfterRenderFrame(app, cb) {
      app.canvas.afterRenderFrameSet.add(cb)
    },
    removeAfterRenderFrame(app, cb) {
      app.canvas.afterRenderFrameSet.delete(cb)
    },
    addToBeforeRenderFrame(app, cb) {
      app.canvas.beforeRenderFrameSet.add(cb)
    },
    removeBeforeRenderFrame(app, cb) {
      app.canvas.afterRenderFrameSet.delete(cb)
    }
  },
  isProduction() {
    return false
  },
  canOpenCenterGui(e: KeyboardEvent) {
    return e.altKey && e.code === 'KeyD'
  },
  registerDebugItems(app: ParametricApp, debugApp: ParametricAppDebugger) {

    debugApp.registerDebugItem({
      key: '_vue_debug_',
      name: 'Vue点击追踪',
      defaultOn: true,
      group: 'vue',
      desc: '点击vue元素后编辑器自动打开跳转对应代码位置',
      run: () => {
        KunsamVueDebugger.start({
          domList: [],
          maxDepth: 10,
          /* 使用Vscode的话可以展示调用栈，直接用浏览器打开只打开叶节点组件文件 */
          useVscodePlugin: true
        })
      },
      dispose: () => {
        KunsamVueDebugger.end()
      }
    })
    debugApp.registerDebugItem({
      group: KunsamThreeDebugger.BuildInGroup.threejs,
      key: 'threeGui',
      name: 'DebugGUI',
      defaultOn: true,
      desc: '',
      run: () => {
        app.canvas.enableDebugGUI()
      },
      dispose: () => {
        app.canvas.disposeDebugGUI()
      }
    })
  }
})