feat: HMR support for inline template changes#209
Merged
Brooooooklyn merged 1 commit intovoidzero-dev:mainfrom Apr 3, 2026
Merged
feat: HMR support for inline template changes#209Brooooooklyn merged 1 commit intovoidzero-dev:mainfrom
Brooooooklyn merged 1 commit intovoidzero-dev:mainfrom
Conversation
When a component .ts file changes and only the inline `template: `...`` portion differs, route it through the existing component HMR mechanism instead of triggering a full page reload. This gives inline template components the same fast HMR experience as external .html templates. Implementation: - Cache inline template content during transform - In handleHotUpdate, compare old vs new template content - If only the template changed, add to pendingHmrUpdates and send angular:component-update event (same path as external templates) - The existing HMR middleware endpoint already handles inline templates via extractInlineTemplate(), so no middleware changes needed - Falls back to full reload if non-template code also changed
e803857 to
06c9945
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
When a component uses an inline template (
template: \...`), any change to the.tsfile triggers a full page reload — even if only the template string was modified. External.htmltemplates get proper HMR via the customfs.watchhandler, but inline templates don't benefit from this because the template is embedded in the.ts` file.This means developers using inline templates (common in Angular 17+ standalone components) get a significantly worse DX than those using external templates.
Reproduction
template: \Hello
``liveReload: truetemplate: \World
``Fix
In
handleHotUpdate, before triggering a full reload for a component.tsfile change, check if only the inline template portion changed:transform— store the template string for each component filependingHmrUpdatesand sendangular:component-updateevent (same mechanism as external templates)The existing HMR middleware endpoint already handles inline templates via
extractInlineTemplate(), so no middleware changes are needed — it just needs apendingHmrUpdatesentry to serve the update.Test plan
.tsedit (e.g., change a method) → verify full reload still triggers