qiankun 路径问题
qiankun 中的文件路径问题
- qiankun 中entry 为什么是长这样
//hostname/subpath/
?
import-html-entry中,采用了new url(entry,window.location);
, 详细参考 MDN,简单说,它会采取当前的网络协议(http:/https:),然后拼接成entry,也就是http(s)😕/hostname/subpath/(index.html),记着一定要加上拖尾的 / ,否则路由会少一级。或者加上后面的文件名(index.html), 这个时候不需要拖尾的 / - index.html 中的
<base href="xxx"/>
对于qiankun解析文件路径有什么影响?
答案是没有任何影响,qiankun 加载文件的方式与浏览器不同,它压根就没有考虑这个东西 - qiankun是如何计算懒加载的资源文件的路径的
首先,这些只针对js/html, 文件,对于css中的url(),import()是无用的,因为,qiankun 没有办法改写。qiankun 是借助于webpack webpack_public_path这个变量来实现的。简单来说,文件是webpack 打包的,那么它肯定能够找到对应的文件,在运行环境里面唯一缺的就是根目录。所以我们只需要将根目录告诉webpack 就行了。
qiankun 会往微应用的js 沙盒中注入INJECTED_PUBLIC_PATH_BY_QIANKUN这个变量,我们需要做的就是把这个变量赋给webpack.一般我们会在我们的入口js 中第一行,加入下面的代码
import './publicpath.js';
window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__ && (__webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__);