qiankun+vue adapts to vue-pdf pitfalls

The online preview pdf of the vue project can be perfectly solved by vue-pdf, but after adding the qiankun micro front end, it becomes a huge pit.
After introducing vue-pdf, the front desk directly reported an error that the worker could not be loaded (failed to resolve async component default:securityerror:failed to construct'worker':script at xxxx.worker.js xannot be accessed from origin xxx). If a single project is directly accessed, It can be used normally and can be solved by combining multiple parts of information on the Internet. The method is as follows:

//找到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>

Modify the project’s configuration file vue.config.js

chainWebpack: (config) => {
    config.module
      .rule('worker')
      .test(/\.worker\.js$/)
      .use('worker-loader').loader('worker-loader')
      .options({
        inline: true,
        fallback: false
      }).end();
  }

Restart the project and you can access it normally through qiankun
——————————————
Copyright statement: This article is an original article by CSDN blogger “Jun Liangye” and follows the CC 4.0 BY-SA copyright agreement. Please attach the original source link and this statement when reprinting.
Original link: https://blog.csdn.net/ygxyvip/article/details/119739377

Guess you like

Origin blog.csdn.net/H_shaohui/article/details/132881618