[Technology] IDEs, Emacs and LSP: Python and TypeScript

Back in my day, we had a text editor, a compiler and a Makefile, and we liked it like that.  Maybe we didn't really like it like that.  But it let you write and compile code.

I got attached to Emacs early on (sorry vi) and over the years have accumulated a number of additional packages and lisp code to make development easier and more efficient.  More "recently," Language Server Protocol (LSP) [wiki] [git] was born, initially targeting Microsoft's VSCode, which has allowed the creation of Language Servers that are independent of any specific editor, and made editors more agnostic to which languages they support, by facilitating a standardized interface between the two facilitating the helpful features wanted in Integrated Development Environments (IDEs).

Some common features include:

  • code completion
  • syntax highlighting
  • in-line error/warning indicators
  • refactoring support
  • code navigation to definitions and references
  • in-line API documentation for function signatures and variable typing

With Emacs, many of these features have been available through a variety of internal and external packages independently for a while.   Modes for languages (c-mode, python-mode, web-mode, etc.) have enabled syntax highlighting and code formatting assistance.  company has supported code completion.  flymake has supported syntax checking and error/warning indicators.  Etc.

I decided to update my environment, though, to benefit from the existence of LSP language servers and hopefully simplify my configuration and approach.  With Emacs often comes a lot of choice and some custom configuration.  That can be great to achieve an ideal environment for yourself, but it can also require a lot of time and attention to figure out what that ideal environment should look like, and just how to glue interacting packages together.  So, I'll share my process.

LSP client modes in Emacs

There are now two prominent options in Emacs

Eglot has recently been merged into core GNU Emacs v29.  According to "the Internet", lsp-mode is more featureful.  I want to try both, but Fedora 38 only ships GNU Emacs v28.3, so I have tried lsp-mode first!   I'll try Eglot once I upgrade to Fedora 39 next week. 

Language Servers for Python

I'm decided to try two different languages, first Python and then TypeScript.  However, both have multiple language servers available.  The pain of making choices!

lsp-mode's language server page lists several options for Python already

  • Pylsp / python-lsp-server [git]
  • Jedi Language Server [git]
  • Palantir Python Language Server [git] (deprecated)
  • Microsoft's Pyright [git]
  • Microsoft Python Language Server [git] (superseded by Pyright)
  • Ruff [git]

So many nice options.  Which to pick?  Well, an interviewer once recommended Pyright so there I go to start.

 Language Servers for TypeScript/JavaScript

Again, options!

  • Deno [site]
  • Sourcegraph's javascript-typescript-langserver [git] (unmaintained)
  • TypeScript Language Server [git] (formerly theia-ide by TypeFox)

This time I went with TypeScript Language Server because lsp-mode's page for it explicitly marks it as recommended.

Additional packages

One issue with IDEs is that all of their features can make an interface busy/noisy and slow.  Sometimes similar information will be redundantly surfaced at multiple points on screen.  lsp-mode is delightful in that it's very modular and (like many IDEs) you can toggle features on and off as you need them.  They even offer a handy visual guide to disabling features.  

lsp-mode also leverages a lot of other packages, some internal and some external, to offer a lot of its functionality.  They list these as some of them: lsp-ui, company, flycheck, flymake, projectile, imenu, xref, lsp-treemacs, dap-mode, lsp-helm, lsp-ivy, consult-lsp, which-key, dired, iedit, emacs-tree-sitter.

Some of these will also leverage other packages and external tools, too.  E.g. flycheckwhich runs syntax checkers can also call pylint, mypy, etc. from outside emacs, to surface errors and warnings on screen. :)  The bolded ones will be included in my set-up steps below.

My configuration: lsp-mode, pyright, pylint

After configuring my system, I reproduced it in a minimal container image (registry.fedoraproject.org/fedora) via podman 

Install emacs and (for pyright) npm.

  $ sudo dnf install emacs
  $ sudo dnf install npm    # for pyright, which is written in typescript

Make sure you have the MELPA package archive configured in your ~/.emacs

  ;; ---- Package Management (package.el, melpa) ----                                
  (require 'package)
  (add-to-list 'package-archives '("melpa" . "https://melpa.org/packages/") t)

Next, you can start emacs and run these commands:

  M-x package-refresh-contents
M-x package-install use-package
;; install a few minimal packages we'll use for LSP/IDE features M-x package-install lsp-mode M-x package-install lsp-ui M-x package-install flycheck ;; show errors and warnings from pyright M-x package-install company ;; auto-complete

;; now to install language support (servers + mode) M-x package-install lsp-pyright
M-x package-install typescript-mode M-x lsp-install-server pyright-tramp
M-x lsp-install-server typescript-language-server

Additional .emacs configuration for newly added LSP/IDE packages:

;; From https://emacs-lsp.github.io/lsp-mode/page/installation/                         
(use-package lsp-mode
;; set prefix for lsp-command-keymap (few alternatives - "C-l", "C-c l")
(setq lsp-keymap-prefix "s-l")
:hook ((python-mode . lsp-deferred))
:hook ((typescript-mode . lsp-deferred))
:commands (lsp lsp-deferred))

(use-package lsp-ui :commands lsp-ui-mode) (setq lsp-ui-doc-show-with-cursor t) ;; From https://emacs-lsp.github.io/lsp-pyright/ (use-package lsp-pyright :ensure t :hook (python-mode . (lambda () (require 'lsp-pyright) (lsp-deferred))))
Show some additional API documentation on screen for symbols!
M-x lsp-ui-sideline-toggle-symbols-info

"flycheck isn't working?!"

One issue that stumped me for a while was lsp failing to show errors/warnings from flycheck when flycheck was configured to use "lsp" as its syntax checker. It turns out that because I often use symlinks from my home directory to my current active projects, I ran into lsp-ui's previously-resolved issue #119 (or potentially a new, similar one). So, if lsp-ui doesn't indicate warnings/errors from flycheck (or flymake), make sure your path isn't via a symlink.  Oops.

Handy Keybindings

Here are some of my most-used/commands keybindings:

  • s-l r r - refactor > rename a symbol
  • s-l g g - go to definition
  • s-l g r - list references
  • C-x ` - go to next error (flycheck)
  • M-x lsp-format-region
  • M-x lsp-format-buffer

Here is a list of others: https://emacs-lsp.github.io/lsp-mode/page/keybindings/

I don't see "s-" often as a prefix, but it's for the Super key (e.g. Windows key).  On my system (Fedora 38 with GNOME), s-l locks my screen, but holding shift along with super works for Emacs too, e.g. "<shift>+<super>+l r r" to rename a symbol.


Something I appreciate most about IDEs and their fancy features is the early detection of problems and API guidance as you code.  I still will add linting/syntax checking/test steps to my build process to guard against bad code entering my repositories.  I will say that I think there is some benefit to being able to code without the guidance of an IDE (e.g. code completion) as it can encourage you to better learn an API in the first place.  But there comes a point when you can focus more on being productive (with the help of tools!) than on exercising your API memorization for a hundredth time. :)

Keine Kommentare:

Kommentar veröffentlichen

Dieses Blog durchsuchen


#Technology #GNOME gnome gxml fedora bugs linux vala google #General firefox security gsoc GUADEC android bug xml fedora 18 javascript libxml2 programming web blogger encryption fedora 17 gdom git emacs libgdata memory mozilla open source serialisation upgrade web development API Spain containers design evolution fedora 16 fedora 20 fedora 22 fedup file systems friends future glib gnome shell internet luks music performance phone photos php podman preupgrade tablet testing typescript yum #Microblog Network Manager adb apache art automation bash brno catastrophe css data loss debian debugging deja-dup disaster docker emusic errors ext4 facebook fedora 19 gee gir gitlab gitorious gmail gobject google talk google+ gtk html libxml mail microsoft mtp mysql namespaces nautilus nextcloud owncloud picasaweb pitivi ptp python raspberry pi resizing rpm school selinux signal sms speech dispatcher systemd technology texting time management uoguelph usability video web design youtube #Tech Air Canada C Electron Element Empathy Europe GError GNOME 3 GNOME Files Go Google Play Music Grimes IRC Mac OS X Mario Kart Memento Nintendo Nintendo Switch PEAP Selenium Splatoon UI VPN Xiki accessibility advertising ai albums anaconda anonymity apple ask asus eee top automake autonomous automobiles b43 backup battery berlin bit rot broadcom browsers browsing canada canadian english cars chrome clarity comments communication compiler complaints computer computers configuration console constructive criticism cron cropping customisation dataloss dconf debug symbols design patterns desktop summit development discoverability distribution diy dnf documentation drm duplicity e-mail efficiency email english environment estate experimenting ext3 fedora 11 festival file formats firejail flac flatpak forgottotagit freedom friendship fuse galaxy nexus galton gay rights gdb german germany gimp gio gjs gnome software gnome-control-center google assistant google calendar google chrome google hangouts google reader gqe graphviz growth gtest gtg gvfs gvfs metadata hard drive hard drives hardware help hp humour ide identity instagram installation instant messaging integration intel interactivity introspection jabber java java 13 jobs kernel keyboard language language servers languages law learning lenovo letsencrypt libreoffice librpm life livecd liveusb login lsp macbook maintainership mariadb mario matrix memory leaks messaging mounting mouse netflix new zealand node nodelist numix obama oci ogg oggenc oh the humanity open open standards openoffice optimisation org-mode organisation package management packagekit paint shedding parallelism pdo perl pipelight privacy productivity progress progressive web apps pumpkin pwa pyright quality recursion redhat refactoring repairs report rhythmbox rust sandboxes scheduling screenshots self-navigating car shell sleep smartphones software software engineering speed sql ssd synergy tabs test tests themes thesis tracker travel triumf turtles tv tweak twist typing university update usb user experience valadoc video editing volunteering vpnc waf warm wayland weather web apps website wifi wiki wireless wishes work xinput xmpp xorg xpath
Powered by Blogger.