Tong Family

Ok, more stuff for developers, this is about getting Typescript to run with Vim. While many people are using VSCode, I guess the muscle memory and speed of Vi (vee-eye not vaay) are just too much an attraction, so here is as how to get the environment working right.

Installing typescript

This is pretty simple on a Mac, brew install typescript does the trick.

Code Completion

As the Pragmatic Pineapple says, vi is hard to learn, but once you get it, it’s hard to give up. His suggestions are to install some beautifiers, but the key thing is to load up Code of Completion and use the tsserver that comes with typescript. I personally have CoC a little confusing and slow, so I’ve stuck with Syntastic and MU-Complete for my vi work. I do sometimes get slowness now with a massive .vimrc script (400 lines but mainly documentation).

But this brings up the whole issue of code completion. This is this really cool feature where as you type, the editor tries to give you reasonable defaults. The Google Workplace folks do an incredible job of this in Google Docs, it guesses whole phrases. Also Xcode does this as does Visual Studio Code. You can get the same with vi, but you need to know the following:

There is a built-in system called omni complete. This needs to be turned on with (see Vim-101) to explain it, but you get a series of cool commands (and hard to remember keystrokes) when you are insert mode. You just add filetype plugin on and set omnifunc=syntaxcomplete#Complete and then when you are inserting text, you can call up a series of completions. The interest command are Ctrl-N to get a completion, Ctrl-X and then Ctrl-L will give you a complete line. This normally is a line that already exists in the file. Then C-X, C-L does a dictionary look up. Finally, try C-X C-O to get language specific.

Second, if you want the options to stick text in to just magically appear, you load Vim-mucomplete which takes any of the completions and then automatically displays them as you type. You have to add a bunch of .vimrc settings and the most important one to remember not to do because there’s a bug is to use let g:mucomplete#enable_auto_at_startup which right now on MacOS with vim causes a startup error. I think he change the start parameter and didn’t up date the documentation.

If you add these lines, the \e will let you rename a symbol and \E will rename even in comments

autocmd FileType typescript nmap <buffer> <Leader>e <Plug>(TsuquyomiRenameSymbol)
autocmd FileType typescript nmap <buffer> <Leader>E <Plug>(TsuquyomiRenameSymbolC)

Syntax checking

Then to do syntax checking, you can load Tsuquyomi to do better syntax checking. This uses Syntastic. If you darn, you can also load CoC and then you can use their builtin. This enables C-X C-O for Typescript since it is an omnicomplete compatible plugin. And you can do C-] to go to a definition for a variable, C-t to return and C-^ to find a reference. Pretty handy.

The main trick is to disable the builtin tsc linter from Syntastic

let g:syntastic_typescript_checkers = ['tsuquyomi']