如何讓tsc在使用baseUrl導入模塊時解析絕對路徑？

考慮一個簡單的打字稿項目用下面的目錄結構：如何讓tsc在使用baseUrl導入模塊時解析絕對路徑？

| 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'

如果我的理解是正確的，打字稿編譯器應該能夠當編譯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時，我們會看到路徑沒有被正確解析，這會給我們一個如果我們要運行它，找不到模塊錯誤。

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

所以我的問題是：我怎樣才能得到tsc正確解析絕對路徑使用baseUrl導入模塊的時候？或者如果這不是可以做到的事情，那麼baseUrl的目的是什麼？

來源

2017-02-21 Zsw

問題是您的模塊加載程序不知道如何找到給定絕對路徑foobar/Foo的模塊。

TypeScript編譯器（tsc）正確解析模塊路徑，否則會出現編譯錯誤。但它相信你會適當地配置你的模塊加載器。

例如，從documentation for RequireJS：

支持的配置選項：

的baseUrl：根路徑用於所有模塊的查找。

打字稿documentation談一點關於爲什麼需要baseUrl：

使用的baseUrl是使用輸入模塊的「部署」到AMD模塊裝載機在應用程序中常見的做法運行時單個文件夾。這些模塊的源代碼可以存在於不同的目錄中，但構建腳本會將它們放在一起。

來源

2017-02-21 04:11:00 Seamus

謝謝！換句話說，'tsc'不負責將絕對路徑轉換爲相對路徑，我應該配置模塊加載器來解析它。如果是這樣的話，有沒有辦法讓'tsc'簡單地轉換爲相對路徑呢？ – Zsw

不，據我所知，'tsc'不會爲你轉換路徑。如果可能的話，在符合模塊加載器spec/config的'import'語句中使用路徑會更容易，然後使用各種編譯器選項來告訴'tsc'如何相應地解析模塊名稱。 – Seamus

@Zsw作爲替代方案，請檢出「outFile」編譯器選項。它將連接模塊到單個輸出中：https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript#concatenate-amd-and-system-modules-with---outfile – Seamus

如何讓tsc在使用baseUrl導入模塊時解析絕對路徑？

回答

相關問題