考虑一个具有以下目录 struct 的简单TypScript项目:

|   package.json
|   tsconfig.json
|               
\---src
    |   app.ts
    |   
    \---foobar
            Foo.ts
            Bar.ts

tsconfig.json已配置为./src/baseUrl.

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6",
        "noImplicitAny": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "outDir": "./dist/",
        "baseUrl": "./src/"
    },
    "include": [
        "./src/**/*"
    ],
    "exclude": [
        "node_modules"
    ]
}

现在假设我们想在Bar.ts中输入Foo.我的理解是,通过设置baseUrl,我们现在可以使用绝对路径来导入模块

import { Foo } from 'foobar/Foo'

相对于相对路径

import { Foo } from './Foo'

如果我的理解是正确的,typescript编译器应该能够在编译Bar.ts时自动解析foobar/Foo./Foo.

import { Foo } from 'foobar/Foo';

export class Bar {
  foo: Foo;

  constructor(num: number) {
    this.foo = new Foo(num);
  }
}

运行tsc次编译,没有错误.然而,当我们实际查看编译后的Bar.js时,我们会发现路径没有正确解析,如果我们运行它,这将给我们一个Cannot find module错误.

"use strict";
const Foo_1 = require("foobar/Foo");
class Bar {
    constructor(num) {
        this.foo = new Foo_1.Foo(num);
    }
}
exports.Bar = Bar;

So my question is: How can I get 100 to correctly resolve the absolute paths when importing modules using 101? Or if this is not something that can be done, what is the purpose of 101 then?

推荐答案

问题是,在给定绝对路径foobar/Foo的情况下,模块加载器不知道如何找到模块.

TypeScript编译器(tsc)正在正确解析模块路径,否则会出现编译错误.但它相信您能够正确配置模块加载器.

例如,从documentation for RequireJS:

支持的配置选项:

baseUrl:用于所有模块查找的根路径.

TypeScript documentation讲述了为什么您可能需要baseUrl:

在使用AMD模块加载器的应用程序中,使用baseUrl是一种常见做法,其中模块在运行时"部署"到单个文件夹.这些模块的源可以位于不同的目录中,但构建脚本会将它们放在一起.

Typescript相关问答推荐

错误:note_modules/@types/note/globals.d.ts:72:13 -错误TS 2403:后续变量声明必须具有相同的类型

TS不推断类型在条件判断后具有属性'

如何创建泛型类型组件来使用React Native的FlatList或SectionList?'

我应该使用什么类型的React表单onsubmit事件?

属性的类型,该属性是类的键,其值是所需类型

如何在另一个参数类型中获取一个参数字段的类型?

使用KeyOf和Never的循环引用

如何在typescript中为this关键字设置上下文

当数组类型被扩展并提供标准数组时,TypeScrip不会抱怨

如何为特定参数定义子路由?

如何定义这样一个TypeScript泛型,遍历路由配置树并累积路径

如何从上传文件中删除预览文件图标?

扩展对象的此内容(&Q;)

埃斯林特警告危险使用&as";

VUE 3类型';字符串';不可分配给类型';参考<;字符串&>

如何从JWT Reaction中提取特定值

类型判断数组或对象的isEmpty

如何在TypeScrip中使用数组作为字符串的封闭列表?

如何实现允许扩展泛型函数参数的类型

JSX.Element';不可分配给类型';ReactNode';React功能HOC