问如何通过引用传递Vue3 Ref变量？(以及缺少的“全局”变量是什么)

EN

<template>
  <div class='text-large-1 text-weight-bold'>
    {{ temperature }}°
  </div>
</template>

<script setup lang='ts'>
import { ref } from 'vue';
import { setupMqtt } from './mqtt';

const temperature = ref(-100)
setupMqtt('temperature', temperature)
</script>

import { connect } from 'mqtt'
import { Ref } from 'vue'

export const setupMqtt = (topic: string, data: Ref): void => {
    const client = connect('mqtt://192.168.10.2:1884')
    const topics = [`dash/${topic}`]
    // removed some setup lines that do not matter
    client.on('message', function (topic: string, message: Buffer) {
      // the key line is below
      data.value = JSON.parse(message.toString())
    })
}

vue-router.mjs:35 [Vue Router warn]: uncaught error during route navigation:
warn @ vue-router.mjs:35
triggerError @ vue-router.mjs:3439
(anonymous) @ vue-router.mjs:3163
Promise.catch (async)
pushWithRedirect @ vue-router.mjs:3157
push @ vue-router.mjs:3089
install @ vue-router.mjs:3520
use @ runtime-core.esm-bundler.js:4349
start @ client-entry.js?t=1663525498443:63
Promise.then (async)
(anonymous) @ client-entry.js?t=1663525498443:82

vue-router.mjs:3441 ReferenceError: global is not defined
    at node_modules/readable-stream/lib/_stream_readable.js (_stream_readable.js:48:21)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/readable-stream/readable-browser.js (readable-browser.js:1:28)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/mqtt/lib/store.js (store.js:8:18)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/mqtt/lib/client.js (client.js:7:15)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/mqtt/lib/connect/index.js (index.js:3:20)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
triggerError @ vue-router.mjs:3441
(anonymous) @ vue-router.mjs:3163
Promise.catch (async)
pushWithRedirect @ vue-router.mjs:3157
push @ vue-router.mjs:3089
install @ vue-router.mjs:3520
use @ runtime-core.esm-bundler.js:4349
start @ client-entry.js?t=1663525498443:63
Promise.then (async)
(anonymous) @ client-entry.js?t=1663525498443:82

vue-router.mjs:35 [Vue Router warn]: Unexpected error when starting the router: ReferenceError: global is not defined
    at node_modules/readable-stream/lib/_stream_readable.js (_stream_readable.js:48:21)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/readable-stream/readable-browser.js (readable-browser.js:1:28)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/mqtt/lib/store.js (store.js:8:18)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/mqtt/lib/client.js (client.js:7:15)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)
    at node_modules/mqtt/lib/connect/index.js (index.js:3:20)
    at __require (chunk-OL3AADLO.js?v=fff356dc:9:50)