如何测试 Quasar（作为 Vue CLI 插件）？

Question

我有 Vue 项目，我在这里使用Quasar Framework 。 我用作Vue CLI 插件的最后一个，它运行良好（代码仓库和实时 url ）。

现在我想在我的项目中添加一些单元测试（使用 jest），我遇到了一个我不明白的问题..

我尝试为NetworkWatcher组件编写一个简单的测试。 该组件使用QIcon组件，我必须在我的测试中导入它：

import { Quasar, QIcon } from "quasar";
import NetworkWatcher from "@/components/NetworkWatcher.vue";

const localVue = createLocalVue();

localVue.use(Vuex);
localVue.use(Quasar, { components: { QIcon } });

describe("NetworkWatcher.vue", () => {});

在这种情况下，我有一个错误：

经过一些实验和搜索，我接下来尝试了

import * as AllQuasar from "quasar";
const { Quasar } = AllQuasar;

const components = Object.keys(AllQuasar).reduce((object, key) => {
  const val = AllQuasar[key];
  if (val && val.component && val.component.name != null) {
    object[key] = val;
  }
  return object;
}, {});

const localVue = createLocalVue();

localVue.use(Vuex);
localVue.use(Quasar, { components });

它有效，我可以通过这种方式 go .. 但我不喜欢它。 好像错了？ 那么为什么第一种方法行不通呢？

我知道 Quasar 有一个很好的“Quasar CLI”版本文档，甚至有它自己的测试运行器。 但我想使用“Vue CLI 插件”版本。

Answer 1

尝试使用下面的代码，因为它无法正确解决类星体依赖关系。

import { Quasar, QIcon } from "quasar-framework/dist/quasar.mat.esm"; //this line is modified 
import NetworkWatcher from "@/components/NetworkWatcher.vue";

const localVue = createLocalVue();

localVue.use(Vuex);
localVue.use(Quasar, { components: { QIcon } });

describe("NetworkWatcher.vue", () => {});