vue项目线上预览pdf可用vue-pdf完美解决，可是加上qiankun微前端后就变成巨坑了。
引入vue-pdf后，前台直接报错加载不了worker(failed to resolve async component default:securityerror:failed to construct‘worker’:script at xxxx.worker.js xannot be accessed from origin xxx )，如果直接访问单个项目则可以正常使用，结合网上多部分资料才得以解决，方法如下：
修改项目的配置文件vue.config.js
//找到vue-pdf的依赖包下的vuePdfNoSss.vue
//找到vue-pdf的依赖包下的vuePdfNoSss.vue
<style src="./annotationLayer.css"></style>
<script>
import componentFactory from './componentFactory.js'
if ( process.env.VUE_ENV !== 'server' ) {
var pdfjsWrapper = require('./pdfjsWrapper.js').default;
var PDFJS = require('pdfjs-dist/es5/build/pdf.js');
if ( typeof window !== 'undefined' && 'Worker' in window && navigator.appVersion.indexOf('MSIE 10') === -1 ) {
// 注释原本的引入方法
// var PdfjsWorker = require('worker-loader!pdfjs-dist/es5/build/pdf.worker.js');
var PdfjsWorker=require('pdfjs-dist/es5/build/pdf.worker.js');
PDFJS.GlobalWorkerOptions.workerPort = new PdfjsWorker();
}
var component = componentFactory(pdfjsWrapper(PDFJS));
} else {
var component = componentFactory({});
}
export default component;
</script>
修改项目的配置文件vue.config.js
chainWebpack: (config) => {
config.module
.rule('worker')
.test(/\.worker\.js$/)
.use('worker-loader').loader('worker-loader')
.options({
inline: true,
fallback: false
}).end();
}
重启项目即可通过qiankun正常访问
