/glint

TypeScript powered tooling for Glimmer templates

Primary LanguageTypeScript

Glint CI

TypeScript-powered tooling for Glimmer templates.

Overview

Glint is a set of tools to aid in developing code that uses the Glimmer VM for rendering, such as Ember.js v3.24+ and GlimmerX projects. Similar to Vetur for Vue projects or Svelte Language Tools, Glint consists of a CLI and a language server to provide feedback and enforce correctness both locally during editing and project-wide in CI.

⚠️ Note: Glint is still under active development! Please bear with us and expect breaking changes and rough edges as we work toward a stable release.

Getting Started

Glint is broken into several different packages that you may use, depending on the details of your project. Typically you'll add @glint/core and a Glint environment package that reflects the type of project you're working on, then add a "glint" key to your tsconfig.json that tells Glint what it should look at.

For more specific details on setting up Glint in your project, take a look at the documentation, in particular the Installation pages for Ember.js projects and for GlimmerX projects.

Using Glint

The @glint/core package includes two executables: glint and glint-language-server.

The glint CLI can be used to typecheck your project in a similar manner to tsc, but with understanding of how values flow through templates.

glint being run at a terminal and producing a tsc-style type error for a template file

You can use the glint executable in CI to ensure you maintain type safety in your templates. You can also use the glint command locally with the --watch flag to monitor your project as you work!

Similarly, glint-language-server can be used by editor integrations to expose that same information inline as you type.

a TypeScript-style type error being shown inline for a template file

The language server can also enable your editor to provide other richer help, such as type information on hover, automated refactoring, and more. See the VS Code extension README for further examples.