使用 Angular 7 在混合應用程序中加載 Angularjs 包

Question

我有一個很大的應用程序，我應用了一些更改以使其成為 Hybrid。

如果舊的 Angularjs 應用程序包首先按時加載，它將正常工作。 （它是一個 4-5MB 的包）我在網上檢查了樣本，其中大多數只是說相同的。 例如：

https://github.com/manfredsteyer/ngUpgrade-lite-sample/blob/master/src/index.html

這會起作用，因為它是一個小應用程序，他只是手動導入所有模塊和組件，而在我的應用程序中不可能有超過 200 個組件。

那么在 Angular 混合應用程序中加載任何東西之前加載 Angularjs 應用程序包的最佳方法是什么？

我將舊應用程序與 Webpack 4 捆綁在一起，並嘗試將其導入main.ts文件中，還嘗試了angular.json 中的script ，但不幸的是，它給了我錯誤：

未捕獲的錯誤：[$injector:nomod] 模塊“app”不可用！

我想這一定是因為在新的 angular 7 引導應用程序之前沒有加載 angularjs

Answer 1

好的，伙計們，我剛剛想通了。 有兩種方法可以做到這一點，首先是創建一個 Javascript 加載器，您可以在此處找到操作方法：

https://davidwalsh.name/javascript-loader

我所做的另一個解決方案是制作一個獨特的構建過程。 這意味着我完全刪除了 Angular 7 構建過程並將其復制到我的 Angularjs Webpack 配置中，因此最終結果是一個包，其中包含同一包中的兩個應用程序。

為此，您可以查看這個包，它為您提供了 Webpack 中的 Angular 構建工具：

https://github.com/angular/ngtools-webpack-builds

請記住，您應該在 Webpack 配置文件中通過raw-laoder處理html和scss文件。

如果我發現新的東西，我會更新這篇文章以提供更多信息。