jsconfig.json

什么是 jsconfig.json？

目录中 jsconfig.json 文件的存在表明该目录是 JavaScript 项目的根目录。jsconfig.json 文件指定了根文件以及 JavaScript 语言服务 提供的功能选项。

提示：如果您未使用 JavaScript，则无需担心 jsconfig.json。

提示：jsconfig.json 是 tsconfig.json 的后代，它是 TypeScript 的配置文件。jsconfig.json 是将 "allowJs" 属性设置为 true 的 tsconfig.json。

为什么我需要一个 jsconfig.json 文件？

Visual Studio Code 的 JavaScript 支持可以在两种不同的模式下运行

• 文件范围 - 无 jsconfig.json：在此模式下，在 Visual Studio Code 中打开的 JavaScript 文件被视为独立单元。只要文件 a.js 没有明确引用文件 b.ts（无论是使用 import 还是 CommonJS 模块），这两个文件之间就没有共同的项目上下文。

• 显式项目 - 使用 jsconfig.json：JavaScript 项目通过 jsconfig.json 文件定义。目录中存在此类文件表明该目录是 JavaScript 项目的根目录。该文件本身可以选择列出属于项目的的文件、要从项目中排除的文件，以及编译器选项（见下文）。

当您的工作区中存在一个定义了项目上下文的 jsconfig.json 文件时，JavaScript 体验会得到改善。因此，当您在新的工作区中打开 JavaScript 文件时，我们会提供创建 jsconfig.json 文件的提示。

jsconfig.json 的位置

通过创建一个 jsconfig.json 文件，我们将网站的客户端代码部分定义为 JavaScript 项目。将该文件放在 JavaScript 代码的根目录下，如下所示。

在更复杂的项目中，您可能在工作区中定义了多个 jsconfig.json 文件。您需要这样做，以便一个项目的代码不会被建议作为另一个项目的 IntelliSense。

示例

默认情况下，JavaScript 语言服务将分析您的 JavaScript 项目中的所有文件并提供 IntelliSense。您需要指定要排除或包含的文件，以提供正确的 IntelliSense。

使用 "exclude" 属性

exclude 属性（glob 模式）告诉语言服务哪些文件不是您源代码的一部分。这可以保持性能处于较高的水平。如果 IntelliSense 速度很慢，请将文件夹添加到您的 exclude 列表中（如果 VS Code 检测到速度下降，它会提示您这样做）。

{
  "compilerOptions": {
    "module": "CommonJS",
    "target": "ES6"
  },
  "exclude": ["node_modules"]
}

提示：您需要 exclude 由构建过程生成的 文件（例如，dist 目录）。这些文件会导致建议显示两次，并会降低 IntelliSense 的速度。

使用 "include" 属性

或者，您可以使用 include 属性（glob 模式）显式设置项目中的文件。如果不存在 include 属性，则默认包含包含目录和子目录中的所有文件。当指定了 include 属性时，只包含这些文件。以下是用显式 include 属性的示例。

{
  "compilerOptions": {
    "module": "CommonJS",
    "target": "ES6"
  },
  "include": ["src/**/*"]
}

提示：exclude 和 include 中的文件路径相对于 jsconfig.json 的位置。

jsconfig 选项

以下是 jsconfig 中用于配置 JavaScript 语言支持的 "compilerOptions"。

提示：不要被 compilerOptions 搞糊涂，因为 JavaScript 不需要实际编译。此属性存在是因为 jsconfig.json 是 tsconfig.json 的后代，而 tsconfig.json 用于编译 TypeScript。

您可以阅读更多关于可用的 compilerOptions 的信息，请查看 TypeScript compilerOptions 文档。

使用 webpack 别名

为了让 IntelliSense 与 webpack 别名一起使用，您需要使用 glob 模式 指定 paths 键。

例如，对于别名 'ClientApp'

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "ClientApp/*": ["./ClientApp/*"]
    }
  }
}

然后使用别名

import Something from 'ClientApp/foo';

最佳实践

只要有可能，您应该排除包含不属于项目源代码的 JavaScript 文件的文件夹。

提示：如果您的工作区中没有 jsconfig.json，VS Code 默认会排除 node_modules 文件夹。

以下是一个表格，将常见项目组件与其安装文件夹映射，这些文件夹建议排除

当您的 JavaScript 项目增长过大，性能变慢时，通常是因为 node_modules 之类的库文件夹。如果 VS Code 检测到您的项目增长过大，它会提示您编辑 exclude 列表。