tsconfig中rootDir和baseUrl的区别

Question

tyescript中的rootDir和baseUrl有什么区别？

根据 ts 文档

基本网址

Base directory to resolve non-relative module names. See Module Resolution documentation for more details.

和 rootDir

Specifies the root directory of input files. Only use to control the output directory structure with --outDir.

在我的 tsconfig 中，我添加了 “baseUrl”：“应用程序/javascript/src”，

并且没有添加任何东西

rootDir

这是正确的吗？ （这有效，但我不确定这是否正确）

更新：rootDir 给了我错误，因为我使用的是绝对路径

这是我的 tsconfig。 （baseUrl 没有）

{
  "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [
      "es6",
      "dom"
    ],
    "module": "es6",
    "moduleResolution": "node",
    "sourceMap": true,
    "jsx": "react",
    "target": "es5",
    "allowSyntheticDefaultImports": true,
    "baseUrl": "app/javascript/src",
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "skipLibCheck": true,
    "allowJs": true,
    "strict": true,
    "outDir": "app/javascript/.dist",
  },
  "exclude": [
    "node_modules",
    "**/*.js",
    "**/.jsx"
  ],
  "include": [
    "**/*.ts",
    "**/*.tsx"
  ],
  "compileOnSave": false
}

在 webpack 中，我正在解析这样的路径

  resolved_paths: ['app/javascript/src', 'app/javascript']

Answer 1

我添加了“baseUrl”：“app/javascript/src”，正确吗？

不。如果您要为项目指定包含的文件（如

src

所示），您应该使用

rootDir

（如前所述

Specifies the root directory of input files.

）。

您没有收到错误的原因

baseUrl

仅对非相对导入有效。您的代码大多具有相对导入，例如

import something from './something'

所以它不会对您产生任何不利影响。

Answer 2

主要区别

目的：

• rootDir：指定源文件的根目录
• baseUrl：设置解析非相对模块名称的基目录。

对产出结构的影响：

• rootDir：影响编译后输出文件的结构。
• baseUrl：简化模块导入，但不影响输出文件。

对编译文件选择的影响：

• rootDir：不影响编译文件的选择。

• baseUrl：仅影响非相对导入。（不影响文件）

结论

因此，rootDir 和 baseUrl 在 TypeScript 配置中具有不同的用途。 rootDir 有助于组织源文件和输出文件的结构，而 baseUrl 则简化了导入模块时对路径的处理。正确使用这些参数可以显着改善项目的组织并简化代码的使用。”