React项目无法识别tsconfig配置的paths路径别名问题求助

• 修正tsconfig.json语法错误
  你当前的include字段错误嵌套在了compilerOptions内部，需要调整到同级位置，修正后配置如下：

{
  "compilerOptions": {
    "strict": true,
    "baseUrl": "./app",
    "paths": {
      "@redux/*": ["redux/*"],
      "@components/*": ["components/*"]
    }
  },
  "include": ["./app/redux/**/*", "**/*.ts", "**/*.tsx"],
  "extends": "expo/tsconfig.base"
}

• 安装babel路径别名解析插件
  TS配置的路径别名仅用于类型校验，Expo项目实际打包由babel处理，需要安装对应插件识别别名：

npm install babel-plugin-module-resolver --save-dev
# 用yarn的话执行：yarn add -D babel-plugin-module-resolver

• 修改babel.config.js配置
  在项目根目录的babel.config.js中添加别名配置，示例如下：

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['babel-preset-expo'],
    plugins: [
      [
        'module-resolver',
        {
          root: ['./app'],
          alias: {
            '@redux': './app/redux',
            '@components': './app/components'
          }
        }
      ]
    ]
  };
};

• 重启开发服务并清理缓存
  配置修改后需要清除缓存才能生效，使用以下命令启动项目：

npx expo start --clear

内容的提问来源于stack exchange，提问作者shubham soni