两次导入同一个模块会抛出 ReferenceError

Question

我是 Javascript 的新手，必须维护这个成长的应用程序。我实现了一项新功能并成功地手动测试了它（应用程序在开发和生产模式下成功构建）。但是当我运行测试时，使用 vue-cli-service test:unit (mocha + chai)，抛出运行time 异常说明：

Exception occurred while loading your tests`
ReferenceError: Cannot access 'serviceBase' before initialization

serviceBase.json:

import api from "./api";
import store from "./../store";
import i18n from "../../plugins/i18n";

export const serviceBase = {
  api: api,
  resource: "",
  preList: "me",
  preListOption: {
    getList: true
  },
{.....}

在多个地方使用，一个是documentImageService.js:

import { createErrorMessage, serviceBase, clearance } from "../service";
import api from "../api";
import axios from "axios";

const DocumentImage = {
  ...serviceBase,
  clearance,
{.....}

现在，这个 const DocumentImage 用在两个地方。一个是 renderer.js

import * as HB from "handlebars";
import { Helpers } from "@lextira/lexgate-document-renderer";
import DocumentImage from "@/store/utils/services/documentImageService.js";

export default class {
  /** @type {HB} */
  handlebars = undefined;
  /** @type {string} */
  clearanceToken = undefined;
{.....}

如果我在此处删除 DocumentImage 的导入，则测试运行不会再出现问题。 renderer.js 还没有测试，因为这是新实现的功能的一部分。然而，正如在介绍中已经说过的那样，当使用浏览器作为运行时间时，包括此渲染器在内的所有内容都可以正常工作。但是这个import DocumentImage好像打破了“测试运行时间”。

我想这与 mocha 运行time 的配置有关，但我无法从现有文档中找到问题所在。

Answer 1

最后证明是循环依赖。即使我大部分时间都不相信它。

DocumentImageStore→DocumentImageService→ServiceBase→NotificationStore.

由于 DocumentImageStore 和 NotificationStore 从同一个 vuex-store 解析，在某些情况下，依赖关系似乎没有得到解决，而在其他情况下却可以（我猜这取决于被要求首先）。

我通过为服务中的 NotificationStore 创建延迟导入来解决它：

const getStore = () => import("./../store");

export const createNotification = function(message) {
  getStore().then(store => {
    store.default.dispatch("notificationStore/createNotification", message)
  });
}

我想最好的办法是完全解决循环依赖，但目前我不知道如何按照现在的实施方式来解决这个问题。

两次导入同一个模块会抛出 ReferenceError

Importing the same module twice throws ReferenceError

javascript

testing

mocha.js

vue.js