Skip to content

Commit

Permalink
add basic documentation about publicURL field on File node (#3752)
Browse files Browse the repository at this point in the history
* add basic documentation about copying files from File nodes to build directory

* A few copy edits

* Format
  • Loading branch information
pieh authored and KyleAMathews committed Jan 28, 2018
1 parent 8798f08 commit aca9a8e
Show file tree
Hide file tree
Showing 2 changed files with 53 additions and 1 deletion.
53 changes: 52 additions & 1 deletion docs/docs/adding-images-fonts-files.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,58 @@ production so you don’t need to worry about long-term caching of assets.

Please be advised that this is also a custom feature of Webpack.

An alternative way of handling static assets is described in the next section.
Two alternative ways of handling static assets is described in the next sections.

## Query for `File` in GraphQL queries using gatsby-source-filesystem

You can query the `publicURL` field of `File` nodes found in your data layer to trigger copying those files to the public directory and get URLs to them.

Examples:

* Copy all `.pdf` files you have in your data layer to your build directory and return URLs to them:

```graphql
{
allFile(filter: { extension: { eq: "pdf" } }) {
edges {
node {
publicURL
}
}
}
}
```

* Copy post attachments defined in your Markdown files:

Link to your attachments in the markdown frontmatter:

```markdown
---
title: "Title of article"
attachments:
- "./assets.zip"
- "./presentation.pdf"
---

Hi, this is a great article.
```

In the article template component file, you can query for the attachments:

```graphql
query TemplateBlogPost($slug: String!) {
markdownRemark(fields: { slug: { eq: $slug } }) {
html
frontmatter {
title
attachments {
publicURL
}
}
}
}
```

## Using the `static` Folder

Expand Down
1 change: 1 addition & 0 deletions packages/gatsby-source-filesystem/src/extend-file-node.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ module.exports = ({ type, getNodeAndSavePathDependency, pathPrefix = `` }) => {
publicURL: {
type: GraphQLString,
args: {},
description: `Copy file to static directory and return public url to it`,
resolve: (file, fieldArgs, context) => {
const details = getNodeAndSavePathDependency(file.id, context.path)
const fileName = `${file.name}-${file.internal.contentDigest}${
Expand Down

0 comments on commit aca9a8e

Please sign in to comment.