javascript - VSCode Intellisense 无法解析绝对路径的导入

我正在使用 TypeScript 维护一个 Electron 应用。我正在尝试在我的项目中实现导入的绝对路径。

我明白你通常解决这个问题的方法是编辑 webpack 配置，但因为我使用的是 React CRA，并且理想情况下不想为了这个问题“弹出”并自己管理配置，所以我一直在寻找其他解决问题的方法。

意图是从类似这样的东西开始：

import * as Constants for '../../../../types/Constants'

到 :

import * as Constants from '@types/Constants'

在阅读了很多文章之后，这些是我“认为”应该采取的步骤：

到目前为止我所做的有：

1. 通过 NPM 安装了 'react-app-rewired'，并设置了 config-overrides.js（以允许绝对导入工作）。
2. 更新了 tsconfig.json 文件（以允许 VSCode “看到” 绝对导入）（编辑：我尝试的大多数步骤来自使用 react、react-app-rewire 和 typescript 的绝对路径）

//~config-overrides.js
module.exports = function override(config, env) {
    config.resolve = {
        ...config.resolve,
        alias: {
            ...config.resolve.alias,
            '@types': path.resolve(__dirname, 'src/types')
        }
    }

    return config;

对 config 进行 console.log() 显示 alias 字段已正确设置。这使系统能够通过其绝对路径识别导入。通过 @types 路径导入按预期工作，我能够构建、启动并与我的应用程序进行交互，没有问题。

问题出现在 VSCode Intellisense 上，它会将所有绝对导入标记为“红色波浪线”，从而阻止诸如自动完成和导航到函数/字段定义之类的功能。我尝试通过如下更新我的 tsconfig.json 文件来解决此问题（特别是添加了“extends”选项和引用的“tsconfig.paths.json”文件）：

// ~tsconfig.json
{
  "extends": "./tsconfig.paths.json",
  "compilerOptions": {
    "target": "ES2015",
    "module": "esnext",
    "allowJs": true,
    "sourceMap": true,
    "outDir": "./build",
    "strict": true,
    "noImplicitAny": false,
    "esModuleInterop": true,
    "preserveSymlinks": true,
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "skipLibCheck": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "isolatedModules": true,
    "noEmit": true,
    "resolveJsonModule": true,
    "jsx": "preserve"
  },
  "include": [
    "src/backend/**/*.ts",
    "src/backend/**/*.tsx",
    "src/backend/**/*.js",
    "src/electron.ts"
  ]
}

// ~tsconfig.paths.json
{
    "compilerOptions": {
        "baseUrl": ".",
        "paths": {
            "@types/*": ["./src/types/*"]
        }
    }
}

可能的问题：当我构建时，我收到以下两个错误信息，我不知道该如何处理它们：

• compilerOptions.baseUrl 不应被设置（不支持绝对导入（尚未支持））
• compilerOptions.paths 不得设置（不支持别名导入）

编辑：我的项目中有一个 TSLint 文件。为了让这个工作，我需要对它进行任何更新吗？