vue3-sfc-loader icon indicating copy to clipboard operation
vue3-sfc-loader copied to clipboard

Vite + Vue3 uses An error is reported in the production environment after the build

Open coffin03 opened this issue 7 months ago • 0 comments

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.

image

<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>

coffin03 avatar Jul 17 '24 11:07 coffin03