使用babel-module-resolver从单个文件导出时的循环依赖性问题

Question

我正在研究一个反应本机项目,而执行热重新加载应用程序进入循环递归,导致超出最大调用堆栈.可以在此处找到有关此问题的更多详细信息

从这里我意识到有一些错误,并且正在创建循环依赖.

我决定试试madge,看看项目中发生了什么.运行命令后,我看到了很多循环依赖项.

现在,因为我的项目是非常庞大的调试,这是一个非常重要的任务所以我创建了一个包含单个文件夹的项目的小版本.

我创建了一个utils文件夹,其中有4个文件: -

1. utils的/ index.js
2. utils的/设备helper.js
3. utils的/ init.js
4. index.js

对于我正在使用的进口 babel-module-resolver

utils的/ init.js

import {deviceInfo} from "utils";

export const init = () => {
  // initialising app and calling backend API with device info
};

utils的/设备helper.js

import DeviceInfo from "react-native-device-info";

const API_LEVEL = "v0";

export const deviceInfo = () => {
  try {
    return Object.assign({}, {
      apiLevel: API_LEVEL,
      deviceId: DeviceInfo.getUniqueID(),
      device: DeviceInfo.getDeviceName(),
      model: DeviceInfo.getModel(),
      osVersion: DeviceInfo.getSystemVersion(),
      product: DeviceInfo.getBrand(),
      country: DeviceInfo.getDeviceCountry(),
      appVersion: DeviceInfo.getVersion(),
      manufacturer: DeviceInfo.getManufacturer(),
      userAgent: DeviceInfo.getUserAgent(),
      buildNumber: DeviceInfo.getBuildNumber(),
      bundleId: DeviceInfo.getBundleId()
    });
  } catch (e) {
    //  TODO: Report to Bugsnag
    return {};
  }
};

utils的/ index.js

export * from "./init";
export * from "./device-info-helper";

index.js

export * from "./utils"; 

运行madge命令后,我得到以下: -

tests-MBP:madge-test harkirat$ madge --circular  index.js
Processed 4 files (684ms)

? Found 1 circular dependency!

1) utils/index.js > utils/init.js

但是,如果我将utils/init.js更改为以下工作: -

utils的/ init.js

import {deviceInfo} from "./device-helpers";


export const init = () => {
  // initialising app and calling backend API with device info
};

我无法理解这种循环依赖的原因.有人可以帮忙吗？

这是存储库的链接.

Answer 1

我在仓库中没有看到 a .babelrc，但我的想法如下：

1. 在utils/init.js您导入时使用：

import {deviceInfo} from "utils";

这与：

import {deviceInfo} from "./utils/index";

2. 在utils/index.js你做一个export * from "./init". 这export from基本上首先导入所有内容./utils/init，然后再导出。

所以：

• utils/init.js进口自./utils/index
• ./utils/index.js进口自./utils/init

这就是你的循环依赖。