Repository files navigation

Copies local files relative linked to/from markdown to yourpublic folder, preserving your directory structure.

This will copy the files linked relative to all Markdown files likegatsby-remark-copy-linked-files into a public directory structure likegatsby-remark-copy-images as it is. It can also copy additional files requested by the document.

$ npm install gatsby-remark-copy-relative-linked-files

// In your gatsby-config.jsplugins:[{resolve:'gatsby-transformer-remark',options:{plugins:['gatsby-remark-copy-relative-linked-files'],},},]

Note: When using thecopyfiles code fence (see below),gatsby-remark-copy-relative-linked-files must appear before general purpose code fence processors likegatsby-remark-prismjs.

Then in your Markdown files, simply reference the files.

---title:My awesome blog post---Hey everyone, here are some sweet files with lots of interesting stuff in them:-![](image.gif)-[archive.zip](archive.zip)-[sample.pdf](sample.pdf)-[report.html](report.html)-[not-copy.rar](https://example.com/not-copy.rar)```copyfilesreport.cssdiagram.png```<imgsrc="sales-growth.png"alt="Diagram of the sales growth" /><audiosrc="sample.mp3"controls></audio><videosrc="sample.mp4"poster="thumbnail.jpg"controls></video><videocontrols>  <sourcesrc="sample2.mp4"type="video/mp4"></video><ahref="sample.svg">SVG Image</a>

image.gif,archive.zip,sample.pdf andreport.html should be in the same directory as the Markdown file. When you build your site, the files will be copied to the public folder and the markdown HTML will be modified to point to it.

Similarly,report.css anddiagram.png should be in the same directory as the Markdown file. In this example,report.html has its own internal relative links to these files.report.html is not changed in any way. The relative links to the copied files work from the copied location.

The copy target is a relative link. Therefore, links starting withXXXX:// or// are ignored. In this examplenot-copy.rar is not copied.

v1.3.0

Pull request bykarlhorky also copied thehref attribute of<a> tag, andposter attribute of<video> tag.

v1.1.0

Pull request bykarlhorky also copied thesrc attribute of<audio>/<video>/<source> tag.

// In your `gatsby-config.js`plugins:[{resolve:'gatsby-transformer-remark',options:{plugins:[{resolve:'gatsby-remark-copy-relative-linked-files',options:{// By default, `.md` is specified// ignoreFileExtensions: ['.md']//// These files will not be copiedignoreFileExtensions:['.md','.pdf','.d.ts'],// Would generate file-1abcb33beeb811dca15f0ac3e47b88d9.pdffilename:({ hash, name, extension})=>`${name}-${hash}.${extension}`,},},],},},]

• ignoreFileExtensionsstring[] - Specify the file extension to be ignored from copying. This plugin is forremark (Markdown), so it specifies.md by default.
• filename(hash: string, name: string, extension: string) => string - Can control the file name as you like. See#15 for details.

• CHANGELOG

• MIT