reactjs - 如何在 react 中从外部/组件导入文件

Question

我的文件夹结构如下:

在我的 App.Js(位于 components 文件夹下)中，我有:

import variables from '/src/EnvVariables/variables.json';

但是，我得到一个错误:

You attempted to import /src/EnvVariables/variables.json which falls
outside of the project src/ directory. Relative imports outside of
src/ are not supported. You can either move it inside src/, or
add a symlink to it from project's node_modules/.

我也试过:

import variables from './src/EnvVariables/variables.json';
import variables from '/src/EnvVariables/variables.json';
import variables from '/src/EnvVariables/variables.json';
import variables from '/EnvVariables/variables.json';
import variables from './EnvVariables/variables.json';

要么给出上述错误，要么说“无法解析文件”。

如他们所说，此文件位于/src 下的文件夹中。但它仍然告诉我它必须在/src/目录下。如何导入我的 variables.json 文件？我不想把它放在“组件”下，我更愿意更好地组织它。

Answer 1

你试过用相对路径导入吗？ (包含一个或多个 ../ 部分)

import variables from "../EnvVariables/variables.json"

当然，如果您更喜欢绝对路径，您可以设置 https://webpack.js.org/configuration/resolve/ ，但我相信首先，您应该尝试第一个解决方案