VueJS PSPDFKit 集成

如何解决VueJS PSPDFKit 集成

我正在尝试将 PSPDFKit（独立）与 VueJS 项目集成，但遇到了一些意外行为。

背景： 我有一个包含 import PSPDFKit from 'pspdfkit' 语句的组件。当我运行 Vue 应用程序并导航到使用该组件的视图时，我得到一个 Uncaught SyntaxError: Unexpected token '<' - 表明我遇到的是 HTML 而不是预期的库。

但是，在本地运行时，如果我注释掉导入行，等待 PSPDFKit is not defined 错误，然后取消注释导入行，查看器会按预期加载。

谁能解释一下这里发生了什么？我正在努力诊断问题并确保集成在第一次加载时按预期工作。组件代码如下。

谢谢

<template>
    <div class="container"></div>
</template>

<script>
import PSPDFKit from 'pspdfkit'

export default {
    name: 'PSPDFKitWrapper',props: ["documentUrl","licenseKey","baseUrl"],_instance: null,mounted: function ()
    {
        this.load();
    },methods: {
        load()
        {
            PSPDFKit.load({
                document: this.documentUrl,container: ".container",licenseKey: this.licenseKey,baseUrl: this.baseUrl
            })
                .then(instance =>
                {
                    this._instance = instance;
                    this.$emit("update:error","");
                })
                .catch(err =>
                {
                    PSPDFKit.unload(".container");
                    this.$emit("update:error",err.message);
                });
        },unload()
        {
            if (this._instance) {
                PSPDFKit.unload(this._instance);
                this._instance = null;
            } else {
                PSPDFKit.unload(".container");
            }
        }
    }

}
</script>

<style scoped>
.container {
    width: 100%;
    height: 90vh;
}
</style>