Search code examples
pdfnuxt.jsnuxt3.js

Nuxt 3 I frame pdf shows 404 after building but works in dev mode


I have an Iframe element which shows a pdf in my Nuxt 3 page, this element works just fine until I run npm run build and then start the builded version for production, the Element then shows a 404 could not find assets/Name_of_pdf.pdf

my I frame :

<iframe src="\static\Name_of_pdf.pdf#page=3" width="100%" height="700px" ></iframe>

and I have the pdf within my assets folder. In npm run dev the iframe and pdf are shown correctly, but after npm run build and node .output/server/index.mjs it shows 404 Page not found: /assets/Name_of_pdf.pdf for the Iframe element

I tried to creat a assets folder with the pdf in it in the .output folder and nearly all sub folders in hope it can find it then but that didn work. I also tried to do it with the pdf within the static folder same error just different path.

Can somebody tell me how to fix this?

Edit: If I put the file in the public folder before building the file correctly appears in the builded public folder but still 404 on the page and the console logs [Vue Router warn]: No match found for location with path "/public/Name_of_pdf.pdf" while the file is there in the public folder :c


Solution

  • The file needed to be in the public directory and with no prefix in the aforementioned path, so just Name_of_pdf.pdf rather than \static\Name_of_pdf.pdf.