How to create a download link (PDF) in React-CodePudding

The PDF file is in my local folder. In fact the same folder where my component is:

I checked few answers on stackoverflow and my code is:

...
const Footer = (props) => {
    return (
      <a href="./Tanzeel_Mirza_Resume.pdf" download="Tanzeel_Mirza_Resume.pdf">Download</a>
    )
}
...

When I click on this link, the PDF gets downloaded but it is blank and size is also 9kb while the actual PDF is 2MB in size.

Clearly I'm doing some silly mistake here. Please point it out.

CodePudding user response：

Try importing the PDF, then downloading with the link, like so:

import pdf from "./Tanzeel_Mirza_Resume.pdf"

const Footer = (props) => {
return (
  <a href={pdf}>Download</a>
)
}

Also, I wanted to point out that you can avoid the ugly hash appended to the file name with this method by specifying a file name with the download property, like this:

<a href={pdf} download="FileName.pdf">Download</a>