how to download static file in gatsby js

Question

I have a website with Gatsby.JS
I want to when click download button, download one static pdf file.

<button>
    <a download={`../../file.pdf`}> İndir</a>
</button>

this ../../file.pdf is path of static folder.
Above code my downloadable code.

But this is not work. How can i fix.?

Answer 1

The download attribute, summarizing a lot is just a way to set the name of the downloadable element but it's the href attribute the one that must point to the item you want to download.

This should work:

<a download={`Some Fancy Name`} href={`../../file.pdf`}>?ndir</a>

Double-check the ../../file.pdf path to ensure that is valid or that the file.pdf belongs to that route.

The static folder replicates its internal structure to the public (/public) one when the site builds. So, a structure like: /static/file.pdf should be pointed as:

<a download={`Some Fancy Name`} href={`/file.pdf`}>?ndir</a>

Since the static folder becomes the "root", the level 0.