FoxForGate Comments - Answer Overflow

Later I will fork the original project and try to fix this problem, but I don't know if the fix will be implemented because analyzing the project's github it is inactive

15 replies

NNuxt

•Created by FoxForGate on 9/13/2024 in #❓・help

Error in the NuxtPDF module

this was the only way to use it, I believe there is some part of the code that when using "exportToPDF" tries to manipulate something on the client, without checking whether the process is occurring on the client side

15 replies

NNuxt

•Created by FoxForGate on 9/13/2024 in #❓・help

Error in the NuxtPDF module

<template>
    <UCard >
        <div class="h-full space-y-5">
            <div ref="pdfSection" class="bg-white h-full">
                <p class="text-gray-900">{{ props.data }}</p>
            </div>
            <UButton @click="createPDF(pdfSection as HTMLElement)" size="lg" label="Baixar PDF" block />
        </div>
    </UCard>
</template>
<script setup lang="ts">

const pdfSection = ref<HTMLElement | null>(null)

interface Props {
  data: any,
}

const props = defineProps<Props>()

const createPDF = async(HTMLElement: HTMLElement) => {
  if(HTMLElement){
    exportToPDF('pdf_protected_export.pdf', HTMLElement,
    {
      encryption: {
        ownerPassword: 'test',
        userPassword: 'test2',
        userPermissions: ['print']
      }
    }, {
      html2canvas: {
        scale: 0.7,
        useCORS: true
      }
    })
  }

}
</script>

<template>
    <UCard >
        <div class="h-full space-y-5">
            <div ref="pdfSection" class="bg-white h-full">
                <p class="text-gray-900">{{ props.data }}</p>
            </div>
            <UButton @click="createPDF(pdfSection as HTMLElement)" size="lg" label="Baixar PDF" block />
        </div>
    </UCard>
</template>
<script setup lang="ts">

const pdfSection = ref<HTMLElement | null>(null)

interface Props {
  data: any,
}

const props = defineProps<Props>()

const createPDF = async(HTMLElement: HTMLElement) => {
  if(HTMLElement){
    exportToPDF('pdf_protected_export.pdf', HTMLElement,
    {
      encryption: {
        ownerPassword: 'test',
        userPassword: 'test2',
        userPermissions: ['print']
      }
    }, {
      html2canvas: {
        scale: 0.7,
        useCORS: true
      }
    })
  }

}
</script>

this is my component responsible for the PDF

        <ClientOnly>
            <PerfilPreviewCurriculo :data="data"/>
        </ClientOnly>

        <ClientOnly>
            <PerfilPreviewCurriculo :data="data"/>
        </ClientOnly>

and in this way I use it

15 replies

NNuxt

•Created by FoxForGate on 9/13/2024 in #❓・help

Error in the NuxtPDF module

I took a better look at the error and looked in the module files to see how it works, the problem is that it works with "jspdf" which does not support the use of SSR, which caused it to try to manipulate information that is part of of the client, in this case the HTMLElement. To resolve this error, I created an isolated component to work only with my PDF and the html related to it and when using it I placed it inside a "ClientOnly" thus resolving the error in question

15 replies

NNuxt

•Created by FoxForGate on 9/13/2024 in #❓・help

Error in the NuxtPDF module

https://sidebase.io/nuxt-pdf/getting-started/quick-start

15 replies

NNuxt

•Created by FoxForGate on 9/13/2024 in #❓・help

Error in the NuxtPDF module

I couldn't, I tried to look through the documentation but the page that was supposed to be the documentation is getting a 404

15 replies

NNuxt

•Created by FoxForGate on 7/26/2024 in #❓・help

Is it possible to use a custom icon in NuxtUI "<UIcon />"?

I'm currently using it this way, but I was wondering if it wasn't possible to simply add new icons

4 replies

NNuxt