【问题标题】:What configuration is required to get VSCode working with TypeScript?让 VSCode 与 TypeScript 一起工作需要什么配置?
【发布时间】:2019-05-15 02:36:43
【问题描述】:

我正在尝试使用 TypeScript 启动和运行 VSCode,但收效甚微。

我正在查看以下内容:

https://code.visualstudio.com/docs/languages/typescript

看起来,一旦你安装了编译器 VSCode 应该就可以工作了,但是给出了以下几点:

tsconfig.json

{
  { 
  "compilerOptions": {
    "target": "es5",                          
    "module": "commonjs",                     
    "esModuleInterop": true                  
  }
}

package.json

{
  "name": "blahh",
  "version": "1.0.0",
  "description": "tryme",
  "main": "index.js",
  "author": "ghost",
  "license": "MIT",
  "devDependencies": {
    "typescript": "^3.4.5"
  }
}

tasks.json

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "tsc-watch",
      "command": "tsc",
      "args": ["-w", "-p", "."],
      "type":"shell",
      "isBackground": true,
      "group":"build",
      "problemMatcher": "$tslint5",
      "presentation":{
        "reveal": "always",
      }
    }
  ]
}

项目

HelloWorld.ts

function sayHello(name: string): void {
    console.log(`Hello ${name}!`);
}

sayHello(1);

从终端正确运行构建任务或 tsc 会指示错误,直到我将 1 更改为字符串然后生成 HelloWorld.js。但是,编辑器无法正常工作,因为没有智能感知、代码完成或错误突出显示。

我尝试了以下方法,但这也没有奏效:

VSCode TypeScript Intellisense not working

其他观察:

  1. 编辑器的边框中没有显示 TypeScript 版本号(正如我在我看到的示例屏幕截图中看到的那样)

  1. 添加以下构建任务时:https://code.visualstudio.com/docs/editor/tasks#vscode 没有显示 tsc:* 模板。

VSCode 信息

Version: 1.33.1 (user setup)
Commit: 51b0b28134d51361cf996d2f0a1c698247aeabd8
Date: 2019-04-11T08:27:14.102Z
Electron: 3.1.6
Chrome: 66.0.3359.181
Node.js: 10.2.0
V8: 6.6.346.32
OS: Windows_NT x64 10.0.17134

已安装的扩展程序

内置

TypeScript Language Basics: Enabled
... many others 

外部

code --install-extension alanz.vscode-hie-server
code --install-extension alefragnani.Bookmarks
code --install-extension andyyaldoo.vscode-json
code --install-extension christian-kohler.path-intellisense
code --install-extension daiyy.quick-html-previewer
code --install-extension eamodio.gitlens
code --install-extension Edka.haskutil
code --install-extension esbenp.prettier-vscode
code --install-extension fabiospampinato.vscode-todo-plus
code --install-extension flowtype.flow-for-vscode
code --install-extension gcazaciuc.vscode-flow-ide
code --install-extension hoovercj.haskell-linter
code --install-extension jcanero.hoogle-vscode
code --install-extension justusadam.language-haskell
code --install-extension karigari.chat
code --install-extension mrmlnc.vscode-duplicate
code --install-extension ms-vscode.vscode-typescript-tslint-plugin
code --install-extension ms-vsliveshare.vsliveshare
code --install-extension ms-vsliveshare.vsliveshare-audio
code --install-extension ms-vsliveshare.vsliveshare-pack
code --install-extension phoityne.phoityne-vscode
code --install-extension SirTobi.code-clip-ring
code --install-extension WakaTime.vscode-wakatime

那么我错过了什么/我应该在我的设置中检查以启用 TypeScript 的交互式 VSCode 功能吗?

【问题讨论】:

  • 您的打字稿输出在内置终端的Output 选项卡中是什么样的?
  • @DonovanHiland 在启动项目和查看HelloWorld.ts 时为空。运行构建任务时:```> 执行任务:tsc -w -p 。
  • 您是否禁用了内置的TypeScript and JavaScript Language Features 扩展?搜索 @builtin typescript 的扩展视图。另外,您还安装了哪些其他扩展程序?
  • @MattBierner TypeScript Language Basics 已启用将编辑问题以添加扩展名
  • TypeScript and JavaScript Language Features 也启用了吗?

标签: typescript visual-studio-code


【解决方案1】:

检查内置 TypeScript and JavaScript Language Features 扩展是否已启用。为此,请在扩展视图中搜索 @builtin typescript

【讨论】:

    猜你喜欢
    • 2015-09-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-05-14
    • 2013-08-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多