{"record":{"id":"524a63ce654ccec2","repo":"angular/angular-cli","slug":"ng-hmr-cannot-get-platformref","errorCode":null,"errorMessage":"[NG HMR] Cannot get 'PlatformRef'.","messagePattern":"\\[NG HMR\\] Cannot get 'PlatformRef'\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"packages/angular_devkit/build_angular/src/tools/webpack/plugins/hmr/hmr-accept.ts","lineNumber":155,"sourceCode":"function getToken<T>(appRoot: any, token: Type<T>): T | undefined {\n  return (typeof ng === 'object' && ng.getInjector(appRoot).get(token)) || undefined;\n}\n\nfunction getApplicationRef(appRoot: any): ApplicationRef | undefined {\n  const appRef = getToken(appRoot, ApplicationRef);\n  if (!appRef) {\n    console.warn(`[NG HMR] Cannot get 'ApplicationRef'.`);\n\n    return undefined;\n  }\n\n  return appRef;\n}\n\nfunction getPlatformRef(appRoot: any): PlatformRef | undefined {\n  const platformRef = getToken(appRoot, PlatformRef);\n  if (!platformRef) {\n    console.warn(`[NG HMR] Cannot get 'PlatformRef'.`);\n\n    return undefined;\n  }\n\n  return platformRef;\n}\n\nfunction dispatchEvents(element: any): void {\n  element.dispatchEvent(\n    new Event('input', {\n      bubbles: true,\n      cancelable: true,\n    }),\n  );\n\n  element.blur();\n\n  element.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' }));","sourceCodeStart":137,"sourceCodeEnd":173,"githubUrl":"https://github.com/angular/angular-cli/blob/bb72145f9ab45aee29f523236b3a25cd0813a841/packages/angular_devkit/build_angular/src/tools/webpack/plugins/hmr/hmr-accept.ts#L137-L173","documentation":"A console.warn from the Angular CLI HMR helper after a hot update. The helper locates the application root element and asks ng.getInjector(appRoot).get(PlatformRef) so it can destroy the old platform before re-bootstrapping. When PlatformRef cannot be resolved from that injector, the warning fires, the old platform is left undestroyed, and the HMR state-restore flow is skipped.","triggerScenarios":"During the mod.hot.dispose callback: getToken(appRoot, PlatformRef) returns undefined because the injector found on the [ng-version] element is not the root platform injector (wrong element matched), ng.getInjector is present but stale (old destroyed app), or a single Angular core instance is not shared between the bundle and the HMR runtime.","commonSituations":"Multiple Angular apps or a re-bootstrap on the same page leaving a stale [ng-version] element; zoneless/experimental bootstrap setups where injector resolution differs; bundled runtime where ng global points to a different Angular core copy than the app's; scripts optimization partially enabled.","solutions":["Make sure only one Angular platform instance/bootstrapped root exists on the page (guard bootstrapModule with an already-bootstrapped check).","Disable scripts optimization in dev so the ng global matches the bundled Angular core (angular.json development: optimization.scripts = false).","Deduplicate @angular/core across bundle and dependencies so the token instance matches.","Disable HMR (--no-hmr) if the app uses a non-standard bootstrap that HMR cannot handle."],"exampleFix":"// main.ts — before\nplatformBrowserDynamic().bootstrapModule(AppModule).catch(err => console.error(err));\n// after (idempotent re-bootstrap, HMR-friendly)\nif (!window['ng']) { platformBrowserDynamic().bootstrapModule(AppModule).catch(err => console.error(err)); }","handlingStrategy":"validation","validationCode":"const appRoot = document.querySelector('[ng-version]');\nif (!appRoot || !(window as any).ng?.getInjector?.(appRoot)?.get) {\n  console.warn('[NG HMR] Platform injector not resolvable; HMR will skip re-bootstrap.');\n}","typeGuard":"function hasPlatformInjector(ng: any, appRoot: Element): boolean {\n  try { return !!ng?.getInjector?.(appRoot)?.get; } catch { return false; }\n}","tryCatchPattern":null,"preventionTips":["Guard bootstrap code so the platform is not bootstrapped twice.","Avoid mixing Angular core copies between bundles.","Use standard bootstrapModule/bootstrapApplication entry points.","Test HMR flow with your exact bootstrap setup before relying on it."],"tags":["hmr","angular","webpack","dependency-injection"],"backgroundTag":"hmr-platform-ref-lookup-failed","analyzedSha":"bb72145f9ab45aee29f523236b3a25cd0813a841","analyzedAt":"2026-08-30T02:47:34.745Z","schemaVersion":2},"datasetVersion":"2026-08-30T03:17:51.788Z"}