Getting Started
Last updated
Last updated
First, add @glint/core, @glint/template and an appropriate Glint environment to your project's devDependencies.
Then, add a "glint" key in your tsconfig.json that tells Glint what environment you're working in and, optionally, which files it should include in its typechecking.
See the Configuration page for more details about options you can specify under the "glint" key. For setup instructions specific to your project type, check out the links below:
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.
You can use the glint executable in CI to ensure you maintain type safety in your templates.
For example, in GitHub Actions you might change this:
To this:
You can also use the glint command locally with the --watch flag to monitor your project as you work!
You can install an editor extension to display Glint's diagnostics inline in your templates and provide richer editor support—typechecking, type information on hover, automated refactoring, and more—powered by glint-language-server:
Install the VS Code Extension.
To get Ember/Glimmer and TypeScript working together, Glint creates a separate TS language service instance patched with Ember-specific support. To prevent invalid or duplicate diagnostics you need to disable VSCode's built-in TS language service in your project's workspace only by following these steps:
In your project workspace, bring up the extensions sidebar Ctrl + Shift + X (macOS: Cmd + Shift + X).
Type @builtin typescript in the extension search box
Click the little gear icon of "TypeScript and JavaScript Language Features", and select "Disable (Workspace)".
Reload the workspace. Glint will now take over TS language services.
