Closed oliverholms closed 4 years ago
Hey,
It seems like a syntax error {data.allFile.edges.map(({ node }) > (
to {data.allFile.edges.map(({ node }) => (
. The = was missing.
return (
<WideGalleryLayout>
{data.allFile.edges.map(({ node }) => (
<Img fluid=
{node.childImageSharp.fluid}
/>
))}
</WideGalleryLayout>
)
}
We're marking this issue as answered and closing it for now but please feel free to reopen this and comment if you would like to continue this discussion. We hope we managed to help and thank you for using Gatsby! 💜
Thank you so much @wardpeet ! That works for me now (although the images are really low quality/compressed). I'll have to try to work out this latter problem tomorrow.
I'm still a little confused as I could see the '=' sign in the code above and in VS Code. I pasted over the top and it worked so maybe I was blind to it...
Thank you again!
8413 Description
I am trying to use
{data.allFile.edges.map(({ node })
to render multiple (local) images to a page, but I can't rungatsby develop
successfully.Steps to reproduce
My code is as follows:
When I run
gatsby develop
I get the below error message:I was following the steps in this eggheads video Add multiple images from a directory with gatsby-image. I am 99% sure that I copied his code correctly — with the correct directory for my files, but the CLI can't
develop
successfully.Expected result
I should be able to render multiple images from a directory with
gatsby-image
. I have checked at http://localhost:8000/___graphql and my graphQL query returns my images with the other data I requested.Actual result
I can't
gatsby develop
successfully or render my images. The terminal error message points to the arrow function as the problem element ('expected comma' etc.)I am new to this so please factor that into the technical language in your answers.
Environment
System: OS: macOS 10.15.5 CPU: (12) x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz Shell: 5.7.1 - /bin/zsh Binaries: Node: 12.18.1 - /usr/local/bin/node npm: 6.14.5 - /usr/local/bin/npm Languages: Python: 2.7.16 - /usr/bin/python Browsers: Chrome: 84.0.4147.125 Safari: 13.1.1 npmPackages: gatsby: ^2.23.12 => 2.23.12 gatsby-image: ^2.4.16 => 2.4.16 gatsby-plugin-emotion: ^4.3.10 => 4.3.10 gatsby-plugin-sharp: ^2.6.27 => 2.6.27 gatsby-plugin-typography: ^2.5.10 => 2.5.10 gatsby-source-filesystem: ^2.3.23 => 2.3.23 gatsby-transformer-json: ^2.4.11 => 2.4.11 gatsby-transformer-remark: ^2.8.27 => 2.8.27 gatsby-transformer-sharp: ^2.5.13 => 2.5.13 npmGlobalPackages: gatsby-cli: 2.12.87