Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(vite-plugin-angular): introduce support for Angular v19 HMR/live reload #1523

Merged
merged 4 commits into from
Dec 27, 2024

Conversation

brandonroberts
Copy link
Member

@brandonroberts brandonroberts commented Dec 27, 2024

PR Checklist

Closes #1524

What is the new behavior?

When using the liveReload option in the analog plugin with Angular v19, the new HMR code generated by the compiler is handled by the vite plugin, enabling HMR updates without full page reloads.

  • Inline styles and templates are supported
  • External styles and templates are supported
  • Page reloads occur when classes are changed (logic copied from Angular compilation)
/// <reference types="vitest" />

import { defineConfig } from 'vite';
import analog from '@analogjs/platform';

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => ({
  // ..other config
  plugins: [analog({ liveReload: true })],
}));

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

Links
https://vite.dev/guide/api-plugin.html#handlehotupdate
https://bjornlu.com/blog/hot-module-replacement-is-easy#importmetahotaccept

[optional] What gif best describes this PR or how it makes you feel?

Copy link

netlify bot commented Dec 27, 2024

Deploy Preview for analog-docs ready!

Name Link
🔨 Latest commit e6be185
🔍 Latest deploy log https://app.netlify.com/sites/analog-docs/deploys/676ecf8178251f0008672033
😎 Deploy Preview https://deploy-preview-1523--analog-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Dec 27, 2024

Deploy Preview for analog-app ready!

Name Link
🔨 Latest commit e6be185
🔍 Latest deploy log https://app.netlify.com/sites/analog-app/deploys/676ecf812be41c00089d7797
😎 Deploy Preview https://deploy-preview-1523--analog-app.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Dec 27, 2024

Deploy Preview for analog-blog ready!

Name Link
🔨 Latest commit e6be185
🔍 Latest deploy log https://app.netlify.com/sites/analog-blog/deploys/676ecf81aa0cb90008c4f097
😎 Deploy Preview https://deploy-preview-1523--analog-blog.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Dec 27, 2024

Deploy Preview for analog-ng-app ready!

Name Link
🔨 Latest commit e6be185
🔍 Latest deploy log https://app.netlify.com/sites/analog-ng-app/deploys/676ecf819e55540008820c16
😎 Deploy Preview https://deploy-preview-1523--analog-ng-app.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@brandonroberts brandonroberts merged commit 0602a8f into beta Dec 27, 2024
24 checks passed
@brandonroberts brandonroberts deleted the feat-ng-hmr branch December 27, 2024 17:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Enable HMR/Live Reload behavior with Angular v19
1 participant