Skip to main content

Typescript

info

You can enable the extra with the :LazyExtras command. Plugins marked as optional will only be configured if they are installed.

Alternatively, you can add it to your lazy.nvim imports
lua/config/lazy.lua
require("lazy").setup({
spec = {
{ "LazyVim/LazyVim", import = "lazyvim.plugins" },
{ import = "lazyvim.plugins.extras.lang.typescript" },
{ import = "plugins" },
},
})

Below you can find a list of included plugins and their default settings.

caution

You don't need to copy the default settings to your config. They are only shown here for reference.

nvim-lspconfig

correctly setup lspconfig

opts = {
-- make sure mason installs the server
servers = {
tsserver = {
enabled = false,
},
vtsls = {
-- explicitly add default filetypes, so that we can extend
-- them in related extras
filetypes = {
"javascript",
"javascriptreact",
"javascript.jsx",
"typescript",
"typescriptreact",
"typescript.tsx",
},
settings = {
complete_function_calls = true,
vtsls = {
enableMoveToFileCodeAction = true,
autoUseWorkspaceTsdk = true,
experimental = {
completion = {
enableServerSideFuzzyMatch = true,
},
},
},
typescript = {
updateImportsOnFileMove = { enabled = "always" },
suggest = {
completeFunctionCalls = true,
},
inlayHints = {
enumMemberValues = { enabled = true },
functionLikeReturnTypes = { enabled = true },
parameterNames = { enabled = "literals" },
parameterTypes = { enabled = true },
propertyDeclarationTypes = { enabled = true },
variableTypes = { enabled = false },
},
},
},
keys = {
{
"gD",
function()
local params = vim.lsp.util.make_position_params()
LazyVim.lsp.execute({
command = "typescript.goToSourceDefinition",
arguments = { params.textDocument.uri, params.position },
open = true,
})
end,
desc = "Goto Source Definition",
},
{
"gR",
function()
LazyVim.lsp.execute({
command = "typescript.findAllFileReferences",
arguments = { vim.uri_from_bufnr(0) },
open = true,
})
end,
desc = "File References",
},
{
"<leader>co",
LazyVim.lsp.action["source.organizeImports"],
desc = "Organize Imports",
},
{
"<leader>cM",
LazyVim.lsp.action["source.addMissingImports.ts"],
desc = "Add missing imports",
},
{
"<leader>cu",
LazyVim.lsp.action["source.removeUnused.ts"],
desc = "Remove unused imports",
},
{
"<leader>cD",
LazyVim.lsp.action["source.fixAll.ts"],
desc = "Fix all diagnostics",
},
{
"<leader>cV",
function()
LazyVim.lsp.execute({ command = "typescript.selectTypeScriptVersion" })
end,
desc = "Select TS workspace version",
},
},
},
},
setup = {
tsserver = function()
-- disable tsserver
return true
end,
vtsls = function(_, opts)
LazyVim.lsp.on_attach(function(client, buffer)
client.commands["_typescript.moveToFileRefactoring"] = function(command, ctx)
---@type string, string, lsp.Range
local action, uri, range = unpack(command.arguments)

local function move(newf)
client.request("workspace/executeCommand", {
command = command.command,
arguments = { action, uri, range, newf },
})
end

local fname = vim.uri_to_fname(uri)
client.request("workspace/executeCommand", {
command = "typescript.tsserverRequest",
arguments = {
"getMoveToRefactoringFileSuggestions",
{
file = fname,
startLine = range.start.line + 1,
startOffset = range.start.character + 1,
endLine = range["end"].line + 1,
endOffset = range["end"].character + 1,
},
},
}, function(_, result)
---@type string[]
local files = result.body.files
table.insert(files, 1, "Enter new path...")
vim.ui.select(files, {
prompt = "Select move destination:",
format_item = function(f)
return vim.fn.fnamemodify(f, ":~:.")
end,
}, function(f)
if f and f:find("^Enter new path") then
vim.ui.input({
prompt = "Enter move destination:",
default = vim.fn.fnamemodify(fname, ":h") .. "/",
completion = "file",
}, function(newf)
return newf and move(newf)
end)
elseif f then
move(f)
end
end)
end)
end
end, "vtsls")
-- copy typescript settings to javascript
opts.settings.javascript =
vim.tbl_deep_extend("force", {}, opts.settings.typescript, opts.settings.javascript or {})
end,
},
}

mason.nvim

opts = function(_, opts)
opts.ensure_installed = opts.ensure_installed or {}
table.insert(opts.ensure_installed, "js-debug-adapter")
end

nvim-dap (optional)

opts = function()
local dap = require("dap")
if not dap.adapters["pwa-node"] then
require("dap").adapters["pwa-node"] = {
type = "server",
host = "localhost",
port = "${port}",
executable = {
command = "node",
-- 💀 Make sure to update this path to point to your installation
args = {
LazyVim.get_pkg_path("js-debug-adapter", "/js-debug/src/dapDebugServer.js"),
"${port}",
},
},
}
end
if not dap.adapters["node"] then
dap.adapters["node"] = function(cb, config)
if config.type == "node" then
config.type = "pwa-node"
end
local nativeAdapter = dap.adapters["pwa-node"]
if type(nativeAdapter) == "function" then
nativeAdapter(cb, config)
else
cb(nativeAdapter)
end
end
end

local js_filetypes = { "typescript", "javascript", "typescriptreact", "javascriptreact" }

local vscode = require("dap.ext.vscode")
vscode.type_to_filetypes["node"] = js_filetypes
vscode.type_to_filetypes["pwa-node"] = js_filetypes

for _, language in ipairs(js_filetypes) do
if not dap.configurations[language] then
dap.configurations[language] = {
{
type = "pwa-node",
request = "launch",
name = "Launch file",
program = "${file}",
cwd = "${workspaceFolder}",
},
{
type = "pwa-node",
request = "attach",
name = "Attach",
processId = require("dap.utils").pick_process,
cwd = "${workspaceFolder}",
},
}
end
end
end