Vuetify/Javascript使用prometheus-query报错ReferenceError:变量未定义

你遇到的ReferenceError: Prometheus is not defined报错核心原因是导入方式不符合包的导出规则，你只引入了包的模块本体，没有提取其中暴露的PrometheusDriver构造函数，自然无法调用。

修复后代码示例 #

<script>
// 显式导入包暴露的PrometheusDriver构造函数
import { PrometheusDriver } from 'prometheus-query'

export default {
  name: 'Mackinac',
  // 把请求逻辑放到mounted生命周期钩子，组件挂载后再执行
  mounted() {
    const prom = new PrometheusDriver({
      // 这里填写你的Prometheus实例地址、认证等配置即可
      endpoint: '你的Prometheus服务地址'
    })
    const q = 'count(node_uname_info{job="MAK_Eos_Lab"})'
    prom.instantQuery(q)
      .then((res) => {
        console.log(res.result)
      })
      .catch(console.error)
  }
}
</script>

注意事项 #

• 必须从包中显式引入PrometheusDriver，仅执行import 'prometheus-query'不会把构造函数挂载到全局作用域
• 注意PrometheusDriver初始化时的参数格式，你原有代码存在多余的右括号语法错误，需要修正
• 不要将异步请求逻辑直接放在script顶层，放到组件生命周期钩子中执行可以避免很多执行顺序异常问题

内容的提问来源于stack exchange，提问作者user12879631