vue3-sfc-loader
vue3-sfc-loader copied to clipboard
Vite + Vue3 uses An error is reported in the production environment after the build
Vite + Vue3
An error is reported in the production environment after the build
It is used normally in the development environment
Can it be used after packaging?
TypeError: unknown file: Cannot destructure property 'parentPath' of 's' as it is undefined.
<template>
<div>
<component :is="remote" v-if="remote" :="props.propsData" />
</div>
</template>
<script setup lang="ts">
import { loadModule } from "vue3-sfc-loader"
import * as Vue from 'vue'
import { onMounted, defineAsyncComponent, ref, watchEffect } from "vue"
let remote = ref()
const props = defineProps({
propsData: {
type: Object,
required: false
},
code: {
type: String,
required: true
},
fileName: {
type: String,
required: true
}
})
onMounted(() => {
load()
})
const load = async (code?: string) => {
console.log(props, 'props--load')
let res = props.code
console.log(res, 'res---load')
const options = {
moduleCache: {
vue: Vue
},
async getFile() {
return res
},
addStyle(textContent) {
const style = Object.assign(document.createElement('style'), { textContent })
const ref = document.head.getElementsByTagName('style')[0] || null
document.head.insertBefore(style, ref)
},
log(type: string, data: any[]) {
console.log(type, data, 'log')
}
};
remote.value = defineAsyncComponent(() => loadModule(props.fileName || "loader.vue", options))
}
</script>