Installing LSP Plugins0:00
For the longest time, things like code navigation and order completion in Vim weren't that great compared with the advancements being made in IDEs that actually understood your code on a deeper level. But then Microsoft introduced the Language Server Protocol, which became an open standard and allowed NeoVim and Vim to use the same language features as VS Code. So let's set it all up for PHP, JavaScript, and Tailwind. We'll jump back into our .files repository, and let's navigate to plugins.lua. We'll then jump down to after our last plugin, and I'll paste in this snippet for the lsp-config plugin. I'm also installing these two extra plugins that will automatically download and install
Configuring PHP Language Server1:09
plugin that will handle the automatic installation as soon as we set up a language server config. Now to set up our language servers, we can jump back over to GitHub to the lsp-config repo, and if we come down, they have a list of all the different configurations for the language servers that are supported. For PHP, we have a few options, but I like the IntelliFence plugin. And you'll see here the first step is installing the IntelliFence language server npm package, but we don't need to do that because Mason will handle that for us. And for the IntelliFence server, we don't need to provide anything to our setup method other than an empty object. You might notice here that we don't have any parentheses in this snippet, and that's because
I've also set up Shift-K to show hover information about the symbol that's under our cursor. The reason I use Shift-K is because in Vim, Shift-K is typically a help option. So it kind of makes sense to me to use that here. And then I've set up LeaderRN to do renaming. Let's go ahead and save all of these files, and then we'll call PackerSync. And once that's installed, you'll see down the bottom it's also installing the language servers using Mason. So let's jump over into this Laravel project to see it all in action. I'm going to open up Vim and jump over to the User model. And then I'll come down to this custom method I added previously.
Testing LSP Navigation4:17
I'm going to open up Vim and jump over to the User model. And then I'll come down to this custom method I added previously. Now, the first thing you might notice is in my status line, you'll see I have two LSP servers connected to this buffer. If I run LSP info, we can see that that's IntelliFence and TailwindCSS. The ViewLanguage server isn't connected to this buffer because it's not registered for the PHP file type. So first off, let's come over to this update method and we'll run gd, which is go to definition. And you'll see it takes us to the model.php file inside our vendor directory for this update method.
And you'll see it takes us to the model.php file inside our vendor directory for this update method. We can then use Ctrl-O to jump back out in the jump list and Ctrl-I to jump back in again. But if we're inside this model.php and we say gr to go to references, you'll see we get this list from Telescope showing us that we have a reference in our user.php, which we can jump to. While we're still on this update method, I can press Shift-K and this will show the hover information. And this is really handy when you're not sure what a method does or what it accepts. And you can push Shift-K twice and that will move our cursor inside the floating window,
Hover and Rename Tools5:16
And this is really handy when you're not sure what a method does or what it accepts. And you can push Shift-K twice and that will move our cursor inside the floating window, which can be handy if there's a lot of information here and the text is scrolling. We can use colon Q to come back out of that once that's open. But if we just use Shift-K without jumping into it, then it'll disappear as soon as we move away. Now let's also have a look at renaming. So let's come over to this $rank variable here, and I'll say leaderRN, and let's change this to level. And you'll see that's renamed that here, but it's also renamed it up here.
Tuning Diagnostics Display6:30
So we can use those square bracket d methods to jump between the two errors. And you'll notice that it pops up a floating window to explain the error as well. And if we're on one of these errors, we can use leader d, which will also pop open that window. Now because I have this floating window, I prefer to get rid of this virtual text that shows up on the side here, because I find it a little bit distracting. So let's jump back into our .files repository, and we'll fix a few of those small things. So to start with, let's come over to our options.lua and down to our signColumn, where we told it to always use a signColumn, but we've told it to only be one column wide. So let's go ahead and make that two columns wide.
we told it to always use a sign column, but we've told it to only be one column wide. So let's go ahead and make that two columns wide. Let's come back to our lspconfig.lua file, and then we'll come down the bottom and add in some configuration to disable the virtual text. And to also modify the floating window to show the source, because sometimes if you've got multiple language servers attached to a buffer, you're not sure where the error message is coming from. So this will just tell us which language server is reporting the error. Last of all, I like to configure the sign definitions. So by default, you might have noticed that the error was showing up with the letter e.
Last of all, I like to configure the sign definitions. So by default, you might have noticed that the error was showing up with the letter e in the column, but I prefer to customize them to use some symbols. So I've got this little cross when it's an error, and then I've got a warning, info, and hint ones. And when you're overriding the sign definitions, you also need to provide the highlight group, so I've just kept with the defaults here. So let's go ahead and we'll save that. And now let's jump into our Laravel project, and I'll just save and quit this file and jump back into it.
And now let's jump into our Laravel project, and I'll just save and quit this file and jump back into it. And once the language server is connected, we'll now see that our diagnostic error is showing beside our git information, which is nice. And the actual diagnostic error doesn't show until we press our leader D. And here you can see the diagnostic is coming from IntelliFence in this case, because we turned on that source option. So that's all for now. In the next video, we'll look at how we can leverage the language server to add auto-completion for our code.
Next: Adding Autocomplete8:22
In the next video, we'll look at how we can leverage the language server to add auto-completion for our code.
