简体   繁体   English

如何让 Visual Studio Code 检查整个项目是否有错误?

[英]How to make Visual Studio Code check entire project for errors?

I'm using VS Code for TypeScript/JavaScript development.我正在使用 VS Code 进行 TypeScript/JavaScript 开发。 When I open a file it will check that file for errors.当我打开一个文件时,它会检查该文件是否有错误。 The problem is if I'm refactoring (like I move some shared code to a new location or change a name) it won't show me the errors this caused until I open the file with the problem.问题是如果我正在重构(比如我将一些共享代码移动到新位置或更改名称),它不会向我显示由此导致的错误,直到我打开有问题的文件。 ...so if I want to do extensive refactoring I have to open every file just to make it scan the file for errors. ...因此,如果我想进行大量重构,我必须打开每个文件,让它扫描文件中的错误。

How can I make VS Code scan the whole project for errors without having to open each file one by one manually?如何让 VS Code 扫描整个项目中的错误,而不必手动逐一打开每个文件?

VS Code (v1.44) has an experimental feature, that allows project wide error reporting in TS. VS Code (v1.44) 具有实验性功能,允许在 TS 中报告项目范围的错误 Try it out:试试看:

// put this line in settings.json
"typescript.tsserver.experimental.enableProjectDiagnostics": true

Figured it out.弄清楚了。 Note this answer is specific to TypeScript, which is what I am using.请注意,此答案特定于我正在使用的 TypeScript。 Here it is:这里是:

Make sure typescript is installed globally (I just had mine installed locally apparently): npm install -g typescript确保打字稿是全局安装的(我只是在本地安装了我的显然): npm install -g typescript

Then in VS Code press Shift + Ctrl + B .然后在 VS Code 中按Shift + Ctrl + B If you don't have a task runner set up it will ask what you want.如果您没有设置任务运行器,它会询问您想要什么。 I selected typescript and the tasks.json file will look like this:我选择了打字稿,tasks.json 文件将如下所示:

{
    "version": "0.1.0",
    "command": "tsc",
    "isShellCommand": true,
    "args": ["-p", "."],
    "showOutput": "silent",
    "problemMatcher": "$tsc"
}

Then pressing Shift + Ctrl + B (or Shift + Command + B in macOS) will check the entire project for problems and they will be reported in your "problems" panel.然后按Shift + Ctrl + B (或 macOS 中的Shift + Command + B )将检查整个项目是否存在问题,它们将在您的“问题”面板中报告。

If you don't want to install TypeScript globally, you can do the following:如果不想全局安装 TypeScript,可以执行以下操作:

  1. Install TypeScript locally on the project, that is yarn add --dev typescript or npm install --save-dev typescript .在项目本地安装 TypeScript,即yarn add --dev typescriptnpm install --save-dev typescript

  2. Add a check-types run script to ./package.json .将 check-types 运行脚本添加到./package.json --noEmit means that the compiler will won't generate any JavaScript files. --noEmit意味着编译器不会生成任何 JavaScript 文件。

{
  "scripts": {
    "check-types": "tsc --noEmit"
  }
}
  1. Let VSCode know about the run script in /.vscode/tasks.json .让VSCode了解在运行脚本/.vscode/tasks.json
{
  "version": "2.0.0",
  "tasks": [
    {
      "type": "npm",
      "script": "check-types",
      "problemMatcher": [
        "$tsc"
      ]
    }
  ]
}
  1. To run the tasks hit the F1 key and select 'Run Task', and then 'npm: check-types'.要运行任务,请按 F1 键并选择“运行任务”,然后选择“npm: check-types”。

  2. If you add the following lines to the task, pressing Ctrl+B will run it.如果您将以下几行添加到任务中,按Ctrl+B将运行它。

    "group": { "kind": "build", "isDefault": true } "group": { "kind": "build", "isDefault": true }

For the most recent version of tasks.json this is the correct json, following deprecations in version 1.14.对于最新版本tasks.json这是正确的 json,遵循版本 1.14 中的弃用。 Create this as /.vscode/tasks.json将其创建为/.vscode/tasks.json

{
    "version": "2.0.0",
    "command": "tsc",
    "type": "shell",
    "args": [
        "-p",
        "."
    ],
    "presentation": {
        "reveal": "silent"
    },
    "problemMatcher": "$tsc"
}

在 vs code 中打开项目后,打开 vs code 终端并运行:

node_modules/.bin/tsc --noEmit
  1. Go to View menu > Extensions and make sure the Microsoft VS Code ESLint extension is installed. Go 查看菜单 > 扩展并确保安装了Microsoft VS Code ESLint 扩展
  2. In Settings, search for "ESLint > Lint Task: Enable", and enable that setting ( docs ).在设置中,搜索“ESLint > Lint 任务:启用”,并启用该设置 ( docs )。
  3. In the Terminal menu, choose Run Task… > eslint: lint whole folder .在终端菜单中,选择 Run Task… > eslint: lint whole folder

None of the other solutions worked fully for me.其他解决方案都不适合我。 Here's a tasks.json that does, working with vscode 1.67+.这是一个tasks.json ,它与 vscode 1.67+ 一起使用。 On Linux etc. set command to tsc , on Windows be sure to run tsc.cmd as tsc alone will attempt to run the bash script and produce the following error:在 Linux 等上将命令设置为tsc ,在 Windows 上确保运行tsc.cmd ,因为单独的tsc将尝试运行 bash 脚本并产生以下错误:

The terminal process failed to launch: A native exception occurred during launch (Cannot create process, error code: 193)

"revealProblems": "always" in the presentation section shows the Problems panel on completion. "revealProblems": "always"presentation部分显示问题面板完成。

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "tsc: error check project",
      "command": "tsc.cmd",
      "args": [
        "-p",
        ".",
        "--noEmit"
      ],
      "isBackground": false,
      "problemMatcher": "$tsc",
      "group": {
        "kind": "build",
        "isDefault": true
      },
      "presentation": {
        "revealProblems": "always",
      }
    }
  ]
}

Its not 100% what you are asking for, but alternatively you can just run tsc in the console and all errors will be printed there.它不是你所要求的 100%,但或者你可以在控制台中运行tsc并且所有错误都将在那里打印。 Does the trick for me.对我有用。

Edit: Since updating to 1.52.0 this no longer works.编辑:自从更新到 1.52.0 这不再有效。 It will instead replace the current project files with what you selected...它将用您选择的内容替换当前的项目文件...

=== ===

I've tried every solution I can find and I think it's safe to say the answer is: You can't *我已经尝试了我能找到的所有解决方案,我认为可以肯定地说答案是:你不能*

The best I've found is still technically opening each file manually, but at least it's not one-by-one:我发现的最好的仍然是技术上手动打开每个文件,但至少它不是一个一个:

  1. You can't drag/drop a directory but you can select multiple files (including directories) and drag/drop.您不能拖/放目录,但可以选择多个文件(包括目录)并拖/放。 The directories will be ignored and any files you had selected will be opened in tabs.这些目录将被忽略,您选择的任何文件都将在选项卡中打开。
  2. Next, you need to give each tab focus so it triggers eslint to run.接下来,您需要为每个选项卡设置焦点,以便触发 eslint 运行。 (Holding down the next tab keyboard shortcut works.) (按住下一个选项卡键盘快捷键有效。)

This is terrible and I beg someone to prove me wrong.这太可怕了,我恳求有人证明我是错的。

*I haven't found a way that works as well as opening files manually. *我还没有找到一种与手动打开文件一样有效的方法。 Each method -- experimental vscode feature and tsc task -- has its own set of drawbacks.每种方法——实验性 vscode 功能和 tsc 任务——都有其自身的缺点。 The vscode feature is clearly the solution but without a way to ignore node_modules, etc. it's too painful to use. vscode 功能显然是解决方案,但无法忽略 node_modules 等。使用起来太痛苦了。

UPDATE .更新
My answer below does not answer the original question, but if you're like me and have found this thread searching for how to turn on // @ts-check project-wide in VSCode so that you don't need to add // @ts-check to every file then my answer below is what you need.我在下面的回答没有回答最初的问题,但如果你像我一样发现这个线程在 VSCode 中搜索如何打开// @ts-check project-wide 这样你就不需要添加// @ts-check到每个文件然后我下面的答案就是你所需要的。 I have searched and searched and kept getting this thread as my top result so hopefully this helps others as well我已经搜索并搜索并一直将此线程作为我的最佳结果,所以希望这也能帮助其他人


I'm on vscode version 1.52.1 and the answer is so simple and right on the vscode website:我使用的是 vscode 1.52.1 版,答案在 vscode 网站上非常简单且正确:

https://code.visualstudio.com/docs/nodejs/working-with-javascript#_type-checking-javascript https://code.visualstudio.com/docs/nodejs/working-with-javascript#_type-checking-javascript

scroll down to the " Using jsconfig or tsconfig " section向下滚动到“使用 jsconfig 或 tsconfig ”部分

Add a jsconfig.json in your project root and add "checkJs": true在你的项目根目录中添加一个 jsconfig.json 并添加"checkJs": true

{
  "compilerOptions": {
    "checkJs": true
  },
  "exclude": ["node_modules", "**/node_modules/*"]
}

You might need to restart vscode once you add it in添加后可能需要重新启动 vscode

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM