Set the publicURL of a static File node, or create a duplicate file node in Gatsby

I am using Gatsby JS to create a static site. The website is being dynamically built from text files using the gatsby-source-filesystem plugin. My config for it is as follows:

    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `Wrappers`,
        path: `${__dirname}/ToolWrappers`,
      },
    },

My requirement is to have stable, systematic URLs for some of my static source files. By default they are being assigned a publicURL such as /static/e97a5c9f35ab32ea270703045bec732d/bwa_aln.cwl, but I need it to be accessible at /packages/bwa/0.7.17/bwa_aln/bwa_aln.cwl. In other words I need to customize the publicURL of these File nodes.

My first attempt was to create a new React page at /packages/bwa/0.7.17/bwa_aln/bwa_aln.cwl which redirects to the static URL, but this is not sufficient because I need this to work as an API that returns raw text data, not HTML.

Secondly, I have tried modifying the URLs of the File nodes using this code in gatsby-node.js:

exports.onCreateNode = ({ node, actions }) => {
  const { createNode, createNodeField } = actions
  if (node.internal.type === 'File'){
    const fields = filenameAttributes(node.relativePath)
    createNodeField({node, name: 'publicURL', value: fields.wrapperUrl})
  }
}

However, this doesn’t seem to actually "stick". The publicURL remains unchanged when I query it in the graphQL browser, and the URL of the actual text files is unaffected.

How can I either modify the publicURL of these files, or else make duplicates of these files with a custom URL?

12 thoughts on “Set the publicURL of a static File node, or create a duplicate file node in Gatsby”

Leave a Comment