如何为 Typescript 明确指定 node_modules 目录

Question

我有以下问题。我有两个应用程序目录 app1 和 app2。我想在 app2 中重用 app1 中的一些代码。为了实现这一点，我在 tsconfig.json 中引入了类型别名： "~/*":["../../app1/src/*"] 当导入没有任何导入的文件时，这可以正常工作。但如果有导入，我会收到如下错误：找不到模块“反应”或其相应的类型声明。 如果我为 app1 安装 node_modules 它也可以，但我希望 Typescript 使用项目 app2 的 node_modules 文件夹来存储从 app1 导入的文件。这有可能实现吗？

app2 的 package.json：

{
  "name": "app2",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@types/react": "^16.9.53",
    "@types/react-dom": "^16.9.8",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "ts-loader": "^8.0.7",
    "typescript": "^4.0.5",
    "webpack": "^5.2.0"
  },
  "devDependencies": {
    "webpack-cli": "^4.1.0"
  }
}

app2 的 tsconfig.json：

{
    "compilerOptions": {
      "baseUrl": "./src",
      "jsx": "react",
      "paths": {
        "~/*": ["../../app1/src/*"]
      }
  }
}
  

Answer 1

您可以在两个应用程序都依赖的“独立”库中提取共享代码。

这个库可以有它自己的依赖和对等依赖（react 是一个很好的对等依赖的候选者）。

否则，您必须添加您在导入它的每个应用程序中导入的代码所需的依赖项。这是因为您像“独立”源文件一样导入它，完全独立于 app1。