背景
我需要在我的应用程序内部使用外部应用程序。外部应用程序位于npm软件包中。我们应该使用ifraime将其放在页面上。我们在 node_modules /.../ build 文件夹中有 index.html 文件,其中有几个相对依赖项。
问题
我们无法解决 html 中的依赖关系,因为一旦页面上显示 iframe ,它就会失去所有依赖关系,因为它开始查看我的根文件夹应用程式。我们尝试了几种选择:
1)从 node_modules 获取 index.html 并带有require。在这种情况下,我们会收到一个纯字符串并失去依赖性。
2)使用围绕iframe的包装器(我们正在使用Angular 4,因此我们创建了@Component)创建新包。我们将外部应用程序添加到此程序包中,希望 WebPack 可以解决该问题。但是问题是一样的。只会将 iframe 和已结算的 src 放在页面上。
3)使用Webpack创建一个捆绑的 js 文件,并将其放入 html 中。但这对我们来说太成问题了。
4)用我们的应用程序内的 WebPack 复制构建文件夹。有用。但是我们不想在我们的内部版本中使用外部应用程序。我们应避免使用此选项。
scr 中包含的图像以及相同的相对路径也可以很好地加载。
是否可以设置iframe的根目录或 node_modules 的路径?也许我们可以为 WebPack 使用一些加载器?