How can I prevent gatsby to download remote files from WordPress?

Question

Whenever I run npm run develop or npm run build gatsby downloads remote files from WordPress and stores them in a cache. Serve images and other static files from the cache.

Since it's downloading remote files every time it's taking a lot of time to complete the download and serve the application. which is not good for development.

I don't want it. I just simply want to use a remote URL to render images. How can I do that?

Answer 1

You have a bunch of options available to customize the behavior in the gatsby-source-wordpress plugin:

• hardCacheMediaFiles (experimental): when set to true , media files will be hard-cached outside the Gatsby cache at ./.wordpress-cache/path/to/media/file.jpeg. This is useful for preventing media files from being re-downloaded when the Gatsby cache automatically clears. When using this option, be sure to gitignore the wordpress-cache directory in the root of your project.

  Usage:

   { resolve: `gatsby-source-wordpress`, options: { production: { hardCacheMediaFiles: true, // false by default }, }, }

  This option won't avoid downloading from the server, it will cache the images to avoid subsequent downloads.

• excludeByMimeTypes : allows preventing the download of files associated with MediaItem nodes by their mime types.

  Usage:

   { resolve: `gatsby-source-wordpress`, options: { type: { MediaItem: { localFile: { excludeByMimeTypes: [`video/mp4`], // add your images format }, }, }, }, }

  This option can potentially avoid downloading your images and the specified formats

• maxFileSizeBytes : allows preventing the download of files that are above a certain file size (in bytes). Default is 15mb.

  Usage:

   { resolve: `gatsby-source-wordpress`, options: { type: { MediaItem: { localFile: { maxFileSizeBytes: 10485760, // 10Mb. Set it to 0 to avoid downloads }, }, }, }, }

  This option can potentially avoid downloading assets from the server.