Since TypeScript 2.2, developers have been able to write language service plugins to enrich the TypeScript development experience. However, as smooth as these plugins might make development, the same did not extend to the plugin installation process.

That’s why I built ts-plugin, a tool to install TypeScript plugins with a single command.

Background

There are a few excellent TypeScript plugins out there, each of which fine-tunes your editor to add support for some specific tools. Most of the current plugins seem to fall into the “embedded language” category, like:

• typescript-styled-plugin (adds CSS intellisense in styled“ templates)
• ts-graphql-plugin (adds GraphQL intellisense in gql“ templates)

Some plugins go beyond that, to add things like tslint diagnostics (tslint-language-service) or project-specific enhancements (typescript-plugin-stencil).

Note I’m the creator of typescript-plugin-stencil, which enables context-aware hovers/documentation and improves completions for Stencil projects.

TypeScript Plugins have a lot of potential, but currently, there seems to be only a handful of projects which take advantage of this powerful tool.

My hope is that ts-plugin can help change that, by allowing developers to manage their TypeScript plugins as easily as they manage project dependencies with NPM.

Using ts-plugin

npx ts-plugin install [plugin-name]

That’s all there is to it!

In the background, ts-plugin will figure out which Node package you’re trying to install, install it as a devDependency, and add it to the plugins section of your tsconfig.json or jsconfig.json file.

Name resolution

One of the cool things about ts-plugin is that it automatically matches a plugin name, like styled or graphql, to the correct package on NPM, in this case typescript-styled-plugin or ts-graphql-plugin.

How does that work? Given a name, styled, it will check the NPM registry for the existence of typescript-plugin-styled | typescript-styled-plugin | ts-plugin-styled | ts-styled-plugin.

• If a single package exists, it will automatically be installed
• If multiple packages exist, the user will be asked to select one (from most popular to least popular)

Unfortunately, the name of the package does not guarantee that the package is actually a TypeScript Language Server plugin. Feel free to open an issue if you have an idea to prevent non-plugins from being installed.

Removing a Plugin

npx ts-plugin uninstall [plugin-name]

It’s just as easy as you’d expect. This command will uninstall the Node package and remove it from the plugins section of your config file.