如何快速配置typescript-tools.nvim：从零开始的完整安装指南

【免费下载链接】typescript-tools.nvim ⚡ TypeScript integration NeoVim deserves ⚡ 项目地址: https://gitcode.com/gh_mirrors/ty/typescript-tools.nvim

typescript-tools.nvim是一款为NeoVim打造的TypeScript集成插件，它作为typescript-language-server的纯Lua替代品，能为大型TS/JS项目提供更快速、更准确的代码补全和重构支持，让你的TypeScript开发体验更上一层楼。

📋 准备工作：安装前的必备条件

在开始安装typescript-tools.nvim之前，请确保你的开发环境满足以下要求：

• NeoVim版本：必须是0.11.0或更高版本
• 依赖插件：需要安装plenary.nvim
• TypeScript环境：本地需安装4.0及以上版本的TypeScript
• Node.js：需安装与TypeScript版本兼容的Node.js

⚡️ 快速安装：两种主流插件管理器配置

使用lazy.nvim安装

如果你使用的是lazy.nvim插件管理器，只需在你的插件配置文件中添加以下代码：

{
  "pmizio/typescript-tools.nvim",
  dependencies = { "nvim-lua/plenary.nvim", "neovim/nvim-lspconfig" },
  opts = {},
}

使用packer.nvim安装

对于packer.nvim用户，可以使用以下配置：

use {
  "pmizio/typescript-tools.nvim",
  requires = { "nvim-lua/plenary.nvim" },
  config = function()
    require("typescript-tools").setup {}
  end,
}

⚠️ 重要提示：安装前请确保已移除nvim-lspconfig中关于typescript-language-server的配置，因为typescript-tools.nvim是它的替代品。

🔧 基础配置：打造个性化开发环境

安装完成后，你需要对插件进行基本配置。创建或编辑你的LSP配置文件，添加以下代码：

require("typescript-tools").setup {
  on_attach = function(client, bufnr)
    -- 在这里添加你的keymap配置
    vim.keymap.set("n", "K", vim.lsp.buf.hover, { buffer = bufnr })
    vim.keymap.set("n", "gd", vim.lsp.buf.definition, { buffer = bufnr })
    -- 可以根据需要添加更多快捷键
  end,
  settings = {
    -- 分离诊断服务器以提高性能
    separate_diagnostic_server = true,
    -- 在插入模式离开时发布诊断信息
    publish_diagnostic_on = "insert_leave",
    -- 代码镜头功能，默认为关闭
    code_lens = "off",
    -- 控制是否自动关闭JSX标签
    jsx_close_tag = {
      enable = false,
      filetypes = { "javascriptreact", "typescriptreact" },
    }
  },
}

🚀 高级配置：释放插件全部潜力

typescript-tools.nvim提供了丰富的高级配置选项，让你可以根据项目需求进行定制。以下是一些常用的高级配置：

自定义tsserver路径

如果你需要使用特定版本的tsserver，可以通过以下配置指定路径：

settings = {
  -- 指定自定义tsserver路径
  tsserver_path = "/path/to/your/tsserver.js",
}

内存管理

对于大型项目，你可能需要调整tsserver的内存限制：

settings = {
  -- 设置内存限制为4GB或使用"auto"自动管理
  tsserver_max_memory = 4096,
}

格式化和代码风格

你可以自定义TypeScript的格式化选项，配置文件位于lua/typescript-tools/config.lua：

settings = {
  tsserver_format_options = {
    insertSpaceAfterCommaDelimiter = true,
    insertSpaceBeforeFunctionParenthesis = false,
    -- 其他格式化选项
  },
  tsserver_file_preferences = {
    quotePreference = "single",
    importModuleSpecifierEnding = "minimal",
    -- 其他代码风格选项
  }
}

💅 styled-components支持配置

要为styled-components启用IntelliSense支持，需要先安装相关插件：

npm i -g @styled/typescript-styled-plugin typescript-styled-plugin

然后在配置中添加：

settings = {
  tsserver_plugins = {
    -- 对于TypeScript v4.9+
    "@styled/typescript-styled-plugin",
    -- 对于旧版本TypeScript
    -- "typescript-styled-plugin",
  },
}

⚙️ 常用命令：提升开发效率

typescript-tools.nvim提供了多个自定义命令，帮助你更高效地进行TypeScript开发：

• TSToolsOrganizeImports：排序并移除未使用的导入
• TSToolsRemoveUnusedImports：移除未使用的导入
• TSToolsFixAll：修复所有可修复的错误
• TSToolsRenameFile：重命名当前文件并更新相关引用
• TSToolsGoToSourceDefinition：跳转到源定义（TS v4.7+支持）

你可以为这些命令设置快捷键，例如：

vim.api.nvim_create_user_command("OrganizeImports", "TSToolsOrganizeImports", {})
vim.keymap.set("n", "<leader>oi", ":TSToolsOrganizeImports<CR>")

🎯 常见问题解决

性能问题

如果在大型项目中遇到性能问题，可以尝试以下解决方案：

1. 确保启用separate_diagnostic_server
2. 调整publish_diagnostic_on为"insert_leave"
3. 增加tsserver_max_memory的值

诊断信息不显示

如果诊断信息没有显示，请检查以下设置：

settings = {
  separate_diagnostic_server = true,
  publish_diagnostic_on = "insert_leave", -- 或"change"
}

代码补全不工作

确保已安装依赖并正确配置：

settings = {
  complete_function_calls = true,
  include_completions_with_insert_text = true,
}

通过以上步骤，你已经成功配置了typescript-tools.nvim插件，为NeoVim打造了强大的TypeScript开发环境。这个插件不仅提供了与Visual Studio Code相似的TypeScript支持，还通过优化的Tsserver通信协议带来了更出色的性能体验。开始享受高效的TypeScript开发吧！

【免费下载链接】typescript-tools.nvim ⚡ TypeScript integration NeoVim deserves ⚡ 项目地址: https://gitcode.com/gh_mirrors/ty/typescript-tools.nvim