Я пытаюсь реализовать HMR в гибридном угловом приложении, используя стратегию downgradeModule, и она просто не работает. Я пришел сюда из другой проблемы Может ли гибридное приложение Angular 5 / 1.x поддерживать HMR? , потому что нет принятого ответа, а ответ @scipper не может работать, я думаю (объяснение ниже).
Я настроил конфигурацию webpack (не ng-cli, custom config) с HMR (добавлено new webpack.HotModuleReplacementPlugin()
, добавлено devServer.hot:true
и другие вещи), и я вижу, что это работает, мой входной файл перезагружается без полной перезагрузки страницы с новыми источниками и webpack очень хорошо применили горячее обновление, но приложения angularj и angularjs не работают (работают со старым кэшированным кодом).
Мой план:
1) добавить модуль hot accept в файл ввода.
2) уничтожить приложение angular.js, если оно существует (с помощью $ rootScope destroy?).
3) уничтожить корневой узел приложения angular.js, если он существует.
4) построить угловой модуль с кодом типа
// bootstrap you new Angular 7 main module
const bootstrapFn = (extraProviders) => {
const platformRef = platformBrowserDynamic(extraProviders);
return platformRef.bootstrapModule(MyAngularSevenModule);
};
const downgradedModule = downgradeModule(bootstrapFn);
5) вызов или повторный вызов модуля angularjs и зависимостей + мой угловой модуль - это моя главная проблема, я думаю.
6) загрузите приложение angularjs (или $ compile + $ digest).
Уже пробовал:
- https://github.com/PatrickJS/angular-hmr - не работает из-за стратегии downgradeModule (корневой узел - ajs).
- https://github.com/vitaliy-bobrov/angular-hot-loader - множество ошибок из-за того, что провайдер и другие перехватчики не реализованы.
- https://github.com/noppa/ng-hot-reload
Я ожидал, что bootstrap обновит кэшированные угловые объекты, но после перезагрузки hmr angular использует старые контроллеры / компоненты / директивы (со свежим кодом на вкладке источника).
Есть предложения?