javascript - 在 Create React App 中设置导入的全局服务

Question

是否可以以某种方式将 jsx 文件声明为全局文件或导入目录？例如代替:

import { Navigation } from '../../../../../../helpers/NavigationService';

只做:

import { Navigation } from 'NavigationService';

我在 webpack 配置中看到了它的可能性，但我在 create-react-app 中没有看到这个文件。我可以使用 package.json 来实现吗？

Answer 1

可以通过三种方法解决您的问题:

1. NODE_PATH(<- 可能是您正在寻找的):

您可以定义一个环境变量 NODE_PATH=src/，然后您可以导入您的服务，如下所示 import { Navigation } from 'helpers/NavigationService';。它会起作用，但这不是必需的，我认为最好的。

无深层嵌套:没有嵌套，首先意味着不存在深度嵌套的问题。您可以尝试使用与此类似的文件层次结构:

src/
  /helpers
  /components/
    /componentA/
      componentA
      relatedComponent
      otherRelatedComponent <- no need for nesting
    /componentB/
  ...

单一 repo 方法:

拥有一个内部帮助程序包并将其导入，例如 import { Navigation } from 'myproject-helpers/NavigationService'; 可能是一个很好的折衷方案