为“Create React App”创建的应用添加绝对路径

IT技术 reactjs typescript create-react-app
2021-05-07 23:10:47

我通过Create React App创建了一个应用程序,更具体地说,我也在使用typescript。

我不知道如何设置绝对路径来访问我的组件、页面等。

在另一种情况下,我会用以下内容更新我的 tscongig:

{
    "compilerOptions": {
      "baseUrl": ".",
      "paths": {
        "@components/*": ["src/components/*"]
      }
    }
  }

但我不知道如何实现这一点,因为我正在使用react-scripts 任何想法?

2个回答

创建一个 tsconfig.json 文件并添加以下代码。

{
  "compilerOptions": {
    "baseUrl": "src"
  },
  "include": [
    "src"
  ]
}

然后您可以将您的组件导入为

import Header from 'components/Header';

如果在您的解决方案中创建一个jsconfig.json文件,您应该能够使用相同的方法,该文件支持与 tsconfig 相同的 baseUrl 和 rootPath 属性。

另一种方法是使用以下行在您的解决方案中添加一个.env文件:

NODE_PATH=src/

此外,除了 env 文件,将此添加到您的 jsconfig.json

{
  "rootDir": "src",
  "compilerOptions": {
    "baseUrl": "src",
    "paths": {
      "*": ["*"]
    }
  }
}

这应该解决编译器能够找到您的绝对导入和正确处理它们的问题。