html中引入iframe,iframe里面的js和css找不到了

用vue写好了组件,webpack打包到dist,希望通过iframe的src指向 dist/index.html的方式,把组件动态的嵌入要所需页面,
实际嵌入的时候,报错
clipboard.png
以下是我的方法,但是onload完成后已经加载了这些css,js,怎么引入这些文件?

var iframe = document.createElement('iframe');
    iframe.src = './dist/index.html?type=department';
    iframe.onload = function() {
      var cssLink = iframe.contentWindow.document.getElementsByTagName('link')[0];
      cssLink.href = cssLink.href.replace(/\w+\/(?=css)/g, 'dist/static/');
      var jsScript = iframe.contentWindow.document.getElementsByTagName('script');
      // debugger;
      for (var i = 0; i < jsScript.length; i++) {
        jsScript[i].src = jsScript[i].src.replace(/\w+\/(?=js)/g, 'dist/static/');
      }
    }
    document.body.appendChild(iframe);
阅读 8.5k
1 个回答

后面根本不需要设置的啊,你打包好了以后你index.html会引入这些文件的,你要做的就是把iframe.src指向index.html的地址就行了啊

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题