Javascript 如何在react native中正确设置路径

在我的React本机应用程序中，导入路径如下所示

import {
  ScreenContainer,
  SLButton,
  SLTextInput,
} from '../../../../../components';
import { KeyBoardTypes } from '../../../../../enums';
import { SIGN_UP_FORM } from '../../../../constants/forms';

我见过一些应用程序，没有“../../../”的路径更清晰、更优雅。如何在React Native中实现这一点

---

我在解决方案中看到，每个文件夹中都有一个package.json文件。我不确定这样做是否正确。

您需要在webpack.config.js中配置别名。你可以找到一个例子

webpack.config.js：

  alias: {
    '@': path.join(__dirname, 'src')
  }

your.js.file.js

import '@/utils/classComponentHooks';

如果您不将wepback用于react native（尽管您可以）。你也可以试试

[
  'module-resolver',
  {
    root: ['./src'],
    alias: {
      '@': './src',
    },
  },
];

---

这是可能的。我做到了。我不推荐。当xcode启动bundler时，它不起作用，因为您必须执行

npm start--reset cache

。您必须使用变通方法来学习IDE并理解此路径。它不适用于流

您可以使用npm

babel插件模块解析器

。巴别塔由地铁公司budler使用

.babelrc

{
  "presets": ["react-native"],
  "plugins": [
    [
      "module-resolver",
      {
        "root": ["./src"],
        "alias": {
          "src": "./src",
          "root": "./"
        }
      }
    ]
  ],
}

---

从React原生版本0.55开始（我不确定具体何时启用），您可以使用项目名称作为路径根

import {DatePanel} from 'MyProject/components/panels';
import HomeScreen from 'MyProject/screens/HomeScreen';

---

流、Xcode等没有问题。

使用绝对路径如何