更新失败：TypeError：无法读取未定义的属性“ injector”

Question

当我在hmr环境中快速保存两次时，会抛出此错误。

它以这种方式引导=>

var hmrBootstrap = function (module, bootstrap) {
    var ngModule;
    module.hot.accept();
    bootstrap().then(function (mod) { return ngModule = mod; });
    module.hot.dispose(function () {
        var appRef = ngModule.injector.get(_angular_core__WEBPACK_IMPORTED_MODULE_0__["ApplicationRef"]);
        var elements = appRef.components.map(function (c) { return c.location.nativeElement; });
        var makeVisible = Object(_angularclass_hmr__WEBPACK_IMPORTED_MODULE_1__["createNewHosts"])(elements);
        ngModule.destroy();
        makeVisible();
    });
};

还有我的main.ts的一部分：

import { hmrBootstrap } from 'hmr';

if (environment.production) {
  enableProdMode();
}

const bootstrap = () => platformBrowserDynamic().bootstrapModule(AppModule);

if (environment.hmr) {
  if (module[ 'hot' ]) {
    hmrBootstrap(module, bootstrap);
  } else {
    console.error('HMR is not enabled for webpack-dev-server!');
    console.log('Are you using the --hmr flag for ng serve?');
  }
} else {
  bootstrap().catch(err => console.log(err));
}

如果您能帮助我，我不知道哪里出了问题。非常感谢你！

Answer 1

在您的hmrBootstrap文件中包含app.module.ts

Answer 2

在我的情况下，发生此错误是因为我忘记了“返回模块”；在bootstrapModule（main.ts）的then（）回调中：

const bootstrap = () => platformBrowserDynamic().bootstrapModule(AppBrowserModule)
  .then(module => {         // <- ADD THIS
     console.log('LOADED');
     return module;         // <- ADD THIS
     // hide loading here dom.remove()
   })
  .catch(error => console.log(error));

P.S。 Configure Hot Module Replacement