JavaScript

Zed 本机支持 JavaScript。

• Tree Sitter：tree-sitter-javascript
• 语言服务器：typescript-language-server

代码格式化

默认情况下，JavaScript 的保存时格式化功能已启用，使用 TypeScript 的内置代码格式化。但许多 JavaScript 项目使用其他命令行代码格式化工具，例如 Prettier。你可以在设置中为 JavaScript 指定一个外部代码格式化程序来使用这些工具之一。有关更多信息，请参阅配置文档。

例如，如果你已安装 Prettier 且在你的 PATH 中，你可以通过将以下内容添加到你的 settings.json 中来使用它格式化 JavaScript 文件

{
  "languages": {
    "JavaScript": {
      "format_on_save": {
        "external": {
          "command": "prettier",
          "arguments": ["--stdin-filepath", "{buffer_path}"]
        }
      }
    }
  }
}

ESLint

你可以通过在格式化时运行 ESLint 代码操作（需要 Zed 0.125.0）来配置 Zed 使用 eslint --fix 格式化代码。

{
  "languages": {
    "JavaScript": {
      "code_actions_on_format": {
        "source.fixAll.eslint": true
      }
    }
  }
}

你还可以仅在使用 fixAll 时执行一个 ESLint 规则

{
  "languages": {
    "JavaScript": {
      "code_actions_on_format": {
        "source.fixAll.eslint": true
      }
    }
  },
  "lsp": {
    "eslint": {
      "settings": {
        "codeActionOnSave": {
          "rules": ["import/order"]
        }
      }
    }
  }
}

注意：您配置的其他格式化程序仍将在 ESLint 之后运行。因此，如果您的语言服务器或 prettier 配置未按照 ESLint 的规则进行格式化，那么它们将覆盖 ESLint 修复的内容，最终导致错误。

如果您仅希望在保存时运行 ESLint，则可以将代码操作配置为格式化程序（需要 Zed 0.130.x）

{
  "languages": {
    "JavaScript": {
      "formatter": {
        "code_actions": {
          "source.fixAll.eslint": true
        }
      }
    }
  }
}

配置 ESLint 的 nodePath

您可以配置 ESLint 的 nodePath 设置（需要 Zed 0.127.0）

{
  "lsp": {
    "eslint": {
      "settings": {
        "nodePath": ".yarn/sdks"
      }
    }
  }
}

配置 ESLint 的 problems

您可以配置 ESLint 的 problems 设置（需要 Zed 0.130.x）。

例如，以下是如何设置 problems.shortenToSingleLine

{
  "lsp": {
    "eslint": {
      "settings": {
        "problems": {
          "shortenToSingleLine": true
        }
      }
    }
  }
}

配置 ESLint 的 rulesCustomizations

您可以配置 ESLint 的 rulesCustomizations 设置

{
  "lsp": {
    "eslint": {
      "settings": {
        "rulesCustomizations": [
          // set all eslint errors/warnings to show as warnings
          { "rule": "*", "severity": "warn" }
        ]
      }
    }
  }
}

Yarn 集成

请参阅 Yarn 文档，了解如何配置项目以使用 Yarn 的演练。