Comment on page
Installation
- 1.add the
@glint/core,@glint/templateand@glint/environment-ember-loosepackages to your project'sdevDependencies - 2.add a
"glint"key with appropriate config to your project'stsconfig.json - 3.add
import '@glint/environment-ember-loose';somewhere in your project
Read on for a more detailed explanation of each of these steps.
Yarn
npm
yarn add --dev @glint/core @glint/template @glint/environment-ember-loose
npm install -D @glint/core @glint/template @glint/environment-ember-loose
tsconfig.json
{
"compilerOptions": { /* ... */ },
"glint": {
"environment": "ember-loose"
}
}
Note that, by default, Glint will assume you want it to analyze all templates in the codebase that are covered by your
tsconfig.json. To ignore any type errors up front so that you can incrementally migrate your project to typesafe templates, consider using the auto-glint-nocheck script to add @glint-nocheck comments to your existing templates that would produce errors.Finally, ensure you've added the following statement somewhere in your project's source files or ambient type declarations:
import '@glint/environment-ember-loose';
You may also choose to disable TypeScript's "unused symbol" warnings in your editor, since Glint will flag any symbols that are actually unused, while
tsserver won't understand any symbol usage that only occurs in templates.When typechecking with vanilla
tsc or your editor's tsserver integration, adding this side-effect import statement ensures that TypeScript is aware of the Glint-specific types provided by the environment package. Without this line, you may find that vanilla TypeScript produces spurious errors.Because Glint uses your project-local copy of TypeScript and the packages whose types it augments for use in templates, it requires certain minimum versions of those packages for compatibility.
Package | Minimum Version |
|---|---|
typescript | 4.8.0 |
@types/ember__component | 4.0.8 |
@glimmer/component | 1.1.2 |
ember-modifier | 3.2.7 |
It's possible to use the 4.x versions of the
@types/ember* packages even if your project is still using an Ember 3.x LTS. Just note that any deprecated APIs you're using that were removed in 4.0 won't be available in the types, and APIs added later will be present in them.If you are using Glint with TypeScript and Ember, visit the Ember CLI TypeScript documentation for more information.
Last modified 1mo ago