為什么 Typescript 在 Visual Studio Code 中忽略我的 tsconfig.json？

Question

我的項目設置是這樣的

project/
|
+---src/
|   |
|   +---app/
|       |
|       sample.ts
|
+---typings/
+---tsconfig.json

這是我的tsconfig.json

{
    "compilerOptions": {
        "rootDir": "src",
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": true,
        "sourceMap": true,
        "noImplicitAny": false,
        "outDir": "dist"
    },
    "exclude": [
        "node_modules",
        "src/assets",
        "src/lib"
    ]
}

我想知道的是，為什么 VSC 會指示錯誤，例如

當顯然完全沒有錯誤時（ "experimentalDecorators": true在tsconfig.json中設置），並且應用程序轉譯得很好？ 而且它不僅僅是裝飾器， Promise等也被突出顯示（我確保將tsconfig.json放在與 typings 相同的文件夾中，並且我安裝了typings es6-shim的 typings）。

不確定這是否重要，但我現在在typescript@2.0.0-dev.20160707上。

Answer 1

簡答

當您使用比 VS Code 提供的更新版本的 TypeScript 時，VS Code 會忽略您的tsconfig.json 。

您正在使用 TypeScript 2.0.0-dev.20160707 ，所以這可能是正在發生的事情。

如何在 VS Code 中使用較新的 TypeScript 版本

首先，將 TypeScript 安裝到您的node_modules 。 選擇穩定或夜間。

npm install typescript --save-dev // stable
npm install typescript@next --save-dev // nightly

其次，將生成的lib相對路徑添加到settings.json 。 即通過文件>設置>用戶settings.json在VS Code中打開settings.json ，並添加以下屬性。

{
  "typescript.tsdk": "node_modules/typescript/lib"
}

請注意，如果全球的裝機量打字稿（ -g ），而不是到你的項目的node_modules ，然后調整typescript.tsdk適當的位置。

第三，確保你有一個有效的tsconfig.json 。 這是一個例子。

{
    "compileOnSave": false,
    "compilerOptions": {
        "sourceMap": true,
        "target": "es5",
        "experimentalDecorators": true,
        "noImplicitAny": false
    },
    "exclude": [
        "node_modules"
    ],
    "filesGlob": [
        "src/**/*.ts",
        "test/**/*.ts",
        "typings/index.d.ts"
    ]
}

文檔

VS Code 隨附了最新的穩定版 TypeScript。 如果要使用較新版本的 TypeScript，可以定義 typescript.tsdk 設置（文件 > 首選項 > 用戶/工作區設置），指向包含 TypeScript tsserver.js 和相應 lib.*.d.ts 文件的目錄. 目錄路徑可以是絕對的，也可以是相對於工作區目錄的。 通過使用相對路徑，您可以輕松地與您的團隊共享此工作區設置並使用最新的 TypeScript 版本 (npm install typescript@next)。 有關如何安裝 TypeScript 的夜間版本的更多詳細信息，請參閱此博客文章。 （強調）。

另請參閱： https : //blogs.msdn.microsoft.com/typescript/2016/01/28/annoucing-typescript-1-8-beta/

Answer 2

找到文件夾typescript安裝由npm ，於我而言，這是：

C:\Users\<username>\AppData\Roaming\npm\node_modules\typescript\\lib

在其他文件中，應該有：

lib.d.ts
tsserver.js

里面。 現在打開設置：

File -> Preferences -> User Settings/Workspace Settings

這應該打開一個文件settings.json ，添加：

{
    "typescript.tsdk": "C:\\Users\\<username>\\AppData\\Roaming\\npm\\node_modules\\typescript\\lib"
}

（注意雙反斜杠\\\\ ），保存並 - 重要 - 重新啟動 Visual Studio Code。 享受。

Answer 3

就我而言，問題是我的 tsconfig.json 位置錯誤。 它在.vscode文件夾中，但它應該上升一個級別。

當我點擊右下角的 Typescript 版本時，我注意到了這一點，VSCode 菜單告訴我沒有找到 tsconfig 文件並提示我創建一個。

Answer 4

我遇到了同樣的錯誤，對我來說問題出在"include": [...]選項，它設置不正確。（沒有覆蓋src文件夾中的所有文件）

Answer 5

就我而言，問題是我正在編輯的.ts文件未包含在tsconfig.json 。

我添加了一個新的scripts/build.ts文件，在tsconfig.json我有：

{
  include: ["src/**/*.ts"]
}

不得不補充：

{
  include: ["src/**/*.ts", "scripts/**/*.ts"]
}

Answer 6

確保您的項目中沒有jsconfig.json文件或任何其他覆蓋配置文件。 這為我解決了問題！

Answer 7

有一個技巧您可能已經注意到，也可能沒有注意到。 當你更改tsconfig時，VS Code 無法識別它，你必須重新啟動 TypeScript 服務器。

當我將 7 個 React 應用程序合並到Turborepo monorepos 時，我遇到了類似的情況，當我對它們進行更改時， tsconfig/.eslintrc無法實時反映這一事實，因此我構建了這個小擴展監視這些配置文件並自動重啟 TypeScript/ESLint 服務器。 希望能幫助到你。

VS代碼擴展：

https://marketplace.visualstudio.com/items?itemName=neotan.vscode-auto-restart-typescript-eslint-servers