Quest: First-Class Component Templates #33
Description
The path to making RFC emberjs/ember.js#779: First-Class Component Templates stable and recommended for end users.
What even is this?
Background
RFC emberjs/ember.js#779: First-Class Component Templates picked <template> tags as the the ability for Ember (and Glimmer) developers to write components with template tags embedded in their JS, like so:
import Component from '@glimmer/component';
const Button = <template>
<button
type='button'
class="my-button"
{{on "click" @onClick}}
>
{{@label}}
</button>
</template>
export default class Player extends Component {
@tracked isPlaying = false;
play = () => (this.isPlaying = true);
pause = () => (this.isPlaying = false);
<template>
<audio src={{@srcUrl}} {{playWhen this.isPlaying}} />
<Button @label="Play" @onClick={{this.play}} />
<Button @label="Pause" @onClick={{this.pause}} />
</template>
}This is not only a general win for ease of working with Ember: it is also a key part of our TypeScript story, because it makes things like go-to-definition, documentation hovers, autocomplete, auto-import, etc. all much easier to manage. So: what do we need to do to finish unblocking its adoption?
The Road to Stable
See ember-cli/ember-template-imports#35 for details on each part of this.
- Prettier support
- ESLint support
- ember-template-lint integration
The Road to Recommended
- Finish and publish specification
- Make any spec-driven updates to
ember-template-imports - Integrate
ember-template-importsinto Glimmer, with Ember being a customer
Metadata
Metadata
Assignees
Type
Projects
Status