Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
muslnode 18–226 runs
build_error
glibcnode 18–226 runs
build_error
Code
Verified usage
Verified import paths — ran on the pinned version, not inferred.
Component
✓ import Component from '@glimmer/component';
✗ import { Component } from '@ember/component';
While older Ember versions might have used `@ember/component`, the modern way for Glimmer components is via `@glimmer/component`. Note: in v6.11.0, the default export `GlimmerComponent` was renamed to `Component` for better DX.
tracked
✓ import { tracked } from '@glimmer/tracking';
✗ import { tracked } from '@ember/object';
Properties that trigger re-renders in Glimmer components are marked with `tracked`. This is a core reactive primitive.
action
✓ import { action } from '@ember/object';
✗ import { action } from '@ember/component';
The `@action` decorator is used to bind methods to the component instance and ensure they are properly handled by Ember's event system.
This quickstart demonstrates a basic Glimmer component with `tracked` properties and an `@action` decorator.
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';
interface Args {
message: string;
}
export default class GreetingComponent extends Component<Args> {
@tracked count = 0;
get greeting() {
return `${this.args.message} World! You clicked ${this.count} times.`;
}
@action
increment() {
this.count++;
}
// Example of a lifecycle hook
constructor(owner: unknown, args: Args) {
super(owner, args);
console.log('GreetingComponent initialized with message:', this.args.message);
}
}
Debug
Known issues
breakingAs of v6.12.0, the Glimmer VM and all `@glimmer/*` packages are merged directly into the `emberjs/ember.js` monorepo. This primarily affects core contributors and integrators, simplifying internal iteration, but might subtly change dependency resolution or tree-shaking behavior in specific edge cases for advanced build setups.fixFor most applications, no direct change is required. Ensure your Ember CLI and related tooling are up-to-date to correctly handle the new monorepo structure. If you had explicit `@glimmer/*` dependencies, they might no longer be needed or should be removed.
affects: >=6.12.0
breakingThe default export `GlimmerComponent` from `@glimmer/component` was renamed to `Component` to improve developer experience and autocomplete. Code directly importing `GlimmerComponent` will break.fixUpdate your imports from `import GlimmerComponent from '@glimmer/component';` to `import Component from '@glimmer/component';`.
affects: >=6.11.0
gotchaEmber's module resolution typically requires using `import` statements at the top level, even though `ember-source` itself ships CommonJS bundles for Node.js environments (like FastBoot). Direct `require()` calls for framework internals are generally discouraged in application code.fixAlways use ES module `import` syntax (`import { Thing } from 'module';`) in your Ember application and addon code. Ember CLI will transpile this correctly for your target environments. affects: >=1.0.0
gotchaUsing `ApplicationInstance#visit` might throw a `TransitionAborted` error if not handled correctly, especially in FastBoot or during rapid navigation/redirects.fixUpdate Ember to at least v6.11.1 or v6.8.4 (for older stable lines) which includes a bugfix to use `followRedirects()` internally. When using `visit()` directly, be prepared to catch and handle `TransitionAborted` errors gracefully.
affects: >=6.8.4, >=6.11.1
gotchaFastBoot environments experienced crashes during component/application destruction, particularly with complex component hierarchies.fixEnsure your `ember-source` version is at least v6.11.1 or v6.8.4 to benefit from bug fixes addressing crashes during destroy in FastBoot.
affects: >=6.8.4, >=6.11.1
Errors
Common errors & fixes
Cannot find module '@glimmer/component' or its corresponding type declarations.
Ember applications or addons using Glimmer components might miss the `@glimmer/component` dependency, or the build system isn't correctly configured to resolve it after the monorepo merge.
fixEnsure `@glimmer/component` is listed in your `package.json` peerDependencies (for addons) or dependencies (for apps) and that `ember-source` is at a compatible version. If on v6.12.0+, verify your Ember CLI version is recent enough to handle the internal Glimmer VM changes.
TypeError: GlimmerComponent is not a constructor
This error likely occurs after upgrading to Ember v6.11.0 or later, where the default export `GlimmerComponent` from `@glimmer/component` was renamed.
fixChange your import statement from `import GlimmerComponent from '@glimmer/component';` to `import Component from '@glimmer/component';`.
Error: Assertion Failed: You must use 'tracked' to mark properties that you intend to use in a template or update reactively.
A property used in a template or relied upon for reactivity was modified, but not decorated with `@tracked`.
fixAdd the `@tracked` decorator from `@glimmer/tracking` to any component property whose changes should trigger a re-render or be reactive.
Audit
Dependencies
@glimmer/componentrequiredPeer dependency for component definition, though as of v6.12.0, Glimmer VM and related packages are merged into the ember.js monorepo.