randolphtellis / vue3-pdfjs Goto Github PK

Could not resolve "canvas" (mark it as external to exclude it from the bundle)

错

[error] [vite:css-post] Transform failed with 2 errors:

✘ [ERROR] Unterminated string token

<stdin>:77:214:
  77 │ ...ct width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);
     ╵                                                                     ^

✘ [ERROR] Unterminated string token

<stdin>:78:207:
  78 │ ...ct width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);
     ╵                                                                     ^

can you help me ?

好像存在内存泄漏问题 每次打开关闭 内存飙升

Need to support with abstracts

Hello, I have a question, why does my 20-page pdf initiate 20 requests, which will cause the loading to be very slow.
Thanks.

报错 缺少字体

Warning: loadFont - translateFont failed: "r: The CMap "baseUrl" parameter must be specified, ensure that the "cMapUrl" and "cMapPacked" API parameters are provided.".

vue3-pdf-embed.js?8066:1 Warning: Error during font loading: The CMap "baseUrl" parameter must be specified, ensure that the "cMapUrl" and "cMapPacked" API parameters are provided.

a41eb984-0e8d-4e85-9dd5-baeb18ef3fff:1 Warning: loadFont - translateFont failed: "r: The CMap "baseUrl" parameter must be specified, ensure that the "cMapUrl" and "cMapPacked" API parameters are provided.".

vue3-pdf-embed.js?8066:1 Warning: Error during font loading: The CMap "baseUrl" parameter must be specified, ensure that the "cMapUrl" and "cMapPacked" API parameters are provided.

a41eb984-0e8d-4e85-9dd5-baeb18ef3fff:1 Warning: loadFont - translateFont failed: "r: The CMap "baseUrl" parameter must be specified, ensure that the "cMapUrl" and "cMapPacked" API parameters are provided.".

vue3-pdf-embed.js?8066:1 Warning: Error during font loading: The CMap "baseUrl" parameter must be specified, ensure that the "cMapUrl" and "cMapPacked" API parameters are provided.

I'd tried to import this module, seems there is error
"TS7016: Could not find a declaration file for module 'vue3-pdfjs/esm'."

Does it support typescript?

$ yarn dev
yarn run v1.22.17
warning ../package.json: No license field
$ vite --host
error when starting dev server:
Error: The following dependencies are imported but could not be resolved:

  vue3-pdfjs/components/vue-pdf/vue-pdf-props (imported by /Users/nihaocun/Code/caseable-nft-web/src/page/introduction/index.vue)
  pdfjs-dist/types/src/display/api (imported by /Users/nihaocun/Code/caseable-nft-web/src/page/introduction/index.vue)

Are they installed?
    at optimizeDeps (/Users/nihaocun/Code/caseable-nft-web/node_modules/vite/dist/node/chunks/dep-9c153816.js:55767:15)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async runOptimize (/Users/nihaocun/Code/caseable-nft-web/node_modules/vite/dist/node/chunks/dep-9c153816.js:56647:44)
    at async Server.httpServer.listen (/Users/nihaocun/Code/caseable-nft-web/node_modules/vite/dist/node/chunks/dep-9c153816.js:56662:21)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

But I'm afraid I did install it, is there any configuration that needs to be done?

Incidentally, there is no problem using vite build

It's not possible to build it in other way than develop, because some scripts inside vue3-pdfjs have no declarations:

failed build:

SyntaxError: Cannot use import statement outside a module

Hi @randolphtellis,

First of all I wanted to thank you for the development of this component. And reviewing the example of the storybook I have a question about how to implement a functionality, I would like to change the page that is displayed in the canvas dynamically as it happens when I increase the number in the input of the storybook, but I have not been able to achieve it.

At the moment I have a variable associated to an input that indicates the number of the page and that value I pass it to the page props of the component, but when changing the value of the number the page is not updated on the screen and I was wondering how you achieve it in the storybook, thanks. Maybe I'm overlooking, but I'm out of ideas.

My code is this

<template>
    <input
        id="file-upload"
        name="file-upload"
        type="file"
        class="sr-only"
        @change="handleFile"
    />
    <select name="pages" id="pages" v-model="signPage">
        <option v-for="page in pages" :key="page" :value="page">
            {{ page }}
        </option>
    </select>
    <VuePdf
        :src="file"
        :page="signPage"
        enableTextSelection
        enableAnnotations
    />
</template>

<script>
import { computed, ref } from '@vue/reactivity'
import { VuePdf, createLoadingTask } from 'vue3-pdfjs/esm'

export default {
    components: {
        VuePdf,
    },
    setup() {
        const file = ref('')
        const signPage = ref(1)
        const numOfPages = ref(0)
        const pages = computed(() =>
            [...Array(numOfPages.value + 1).keys()].slice(1)
        )

        const handleFile = (event) => {
            file.value = URL.createObjectURL(event.target.files[0])

            const loadingTask = createLoadingTask(file.value)
            loadingTask.promise.then((pdf) => {
                numOfPages.value = pdf.numPages
            })
        }

        return {
            file,
            signPage,
            pages,
            numOfPages,
            // Methods
            handleFile,
        }
    },
}
</script>

The width and height of each canvas rendered on the mobile phone for the first time are fine. The text display position is correct, but the background display is incomplete, accounting for only a fraction. I don't know what the reason is. Ask for help.

Hello, there is the wrong scale on normal, vertical print mode - the height is too big.

Is there any way to fix the height of this content?

Example:

Hello, when I attempt to enable annotations by just following the basic example, I get following series of errors:

Uncaught (in promise) TypeError: this.linkService.getDestinationHash is not a function
    at LinkAnnotationElement._bindLink (annotation_layer.js:652:34)
    at LinkAnnotationElement.render (annotation_layer.js:601:12)
    at AnnotationLayer.render (annotation_layer.js:2566:34)
    at index-19f89c12.js:1474:48

Uncaught (in promise) TypeError: linkService.addLinkAttributes is not a function
    at LinkAnnotationElement.render (annotation_layer.js:595:19)
    at AnnotationLayer.render (annotation_layer.js:2566:34)
    at index-19f89c12.js:1474:48

On repeat for each present link in the loaded PDF. For now I just disabled annotations, as they are not critical for my use-case, but I am wondering what could be the source of the issues, and if somebody managed to fix this?

Running on Vue 3.0.7 with Vite 5.0 build stack, using Options API.

Thank you very much for your time.

Multi-page pdf preview exception after build.
{
message: "Cannot read properties of null (reading 'headersReady')",
name: 'UnknownErrorException',
details: "TypeError: Cannot read properties of null (reading 'headersReady')"
}
In the development mode is OK, Is there a problem with the build?