graysonhicks / gatsby-plugin-remote-images

:floppy_disk: A Gatsby.js plugin for downloading and linking remote images from another node's field for the benefits of gatsby-image.
155 stars 39 forks source link

Documentation issue re: nodeType field #82

Closed darylwright closed 2 years ago

darylwright commented 2 years ago

In the documentation, the instructions for setting the nodeType property is incorrect. The current documentation states the following:

Option Name | Description | Required | Default -- | -- | -- | -- nodeType | The node type that has the images you want to grab. This is generally the camelcased version of the word after the ‘all’ in GraphQL ie. allMyImages type is myImages | ✅ | null

This is inaccurate as I was not able to get this working. What ended up working for me was using the title cased portion of the root type. In the previous example, MyImages would enable the plugin for that data type instead of myImages. I suggest the following changes to the documentation:

Option Name | Description | Required | Default -- | -- | -- | -- nodeType | The node type that has the images you want to grab. This is generally the title cased version of the word after the ‘all’ in GraphQL ie. allMyImages type is MyImages | ✅ | null

Note that 'title case' and 'camel case' are two words and not one word.

graysonhicks commented 2 years ago

Can you post a reproduction of it not working?

darylwright commented 2 years ago

I'm not quite sure of what you're looking for here in terms of a reproduction, but I can tell you what I've done.

First, I have a JSON data source that is imported into the GraphQL schema via gatsby-transformer-json and gatsby-source-filesystem. The schema of my data source looks similar to the following:

[
  {
    name: "",
    image: "https://someimageurl",
    ...otherFields
  }
]

My Gatsby config for the plugin while it was not working (and following the current documentation steps) was similar to the following:

{
  resolve: `gatsby-plugin-remote-images`,
  options: {
    nodeType: `entityNameJson`, // documentation instructs to change 'allEntityNameJson' to 'entityNameJson', i.e. the camel cased version of the word after 'all'
    imagePath: `image`,
  },
},

Changing to the following produced the results I was looking for, which is the addition of the localImage field on the data type:

{
  resolve: `gatsby-plugin-remote-images`,
  options: {
    nodeType: `EntityNameJson`, // the title cased word works
    imagePath: `image`,
  },
},

I hope this is enough information to go by. The plugin works, it's just that the documentation is currently misleading and can throw off new users.

graysonhicks commented 2 years ago

Sorry for the delay, and thanks for the detailed issue! Just updated the readme