软件技术跟网站开发有关系吗,中企建设网站,网站优化seo网站架构优化,创意平面设计广告问题#xff1a;build时报错#xff1a;document/window is not defined。
背景#xff1a;使用vitepress展示自定义的组件#xff0c;之前build是没有问题了#xff0c;由于新增了qr-code以及quill富文本组件#xff0c;导致打包时报错。
原因#xff1a;vitepress官…问题build时报错document/window is not defined。
背景使用vitepress展示自定义的组件之前build是没有问题了由于新增了qr-code以及quill富文本组件导致打包时报错。
原因vitepress官方文档 由于使用的第三方组件内部会使用到document和windowvitepress打包的时候在服务端渲染的情况下没有document和window就导致的打包报错。
官方的这种两种解决方案在项目里面试了下还是不行不知道是不是因为vitepress的版本问题当前使用的是1.0.0-alpha.13.。由于是内网没有升级成功这两种方法就放弃了。
解决方法 在我们封装组件库的地方使用vue的动态组件进行二次的封装。
templatediv v-ifisClientcomponent :isqrCode v-bind$attrs/component/div
/template
script langts setup
import {shallowRef,onMounted,ref} from vue;
defineOptions({name:qrCode})const isClient ref(false);
const qrCode shallowRef(null);onMounted((){if (!import.meta.env.SSR){import(./index.vue).then(m{qrcode.value m.default;});isClient.value true;}
})/script
