Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Image src is wrong #47

Closed
backurdi opened this issue Jul 5, 2020 · 7 comments · Fixed by #59
Closed

Image src is wrong #47

backurdi opened this issue Jul 5, 2020 · 7 comments · Fixed by #59
Assignees

Comments

@backurdi
Copy link

backurdi commented Jul 5, 2020

I have built an app using forestry, I use the @gridsome/source-filesystem to get the data. It works fine when I just fetch the data using graphql. But when I get the data using gridsome-plugin-flexsearch then the src is wrong, it returns the src on my local machine. I think it has something to do with the src of the data.

Expected data (As returned when just fetching data with graphql)
/assets/static/uploads/content.svg?width=879&fit=cover&key=035634c

Returned data (From gridsome-plugin-flexsearch)
/Users/bachirkurdi/Documents/cyNy/uploads/content.svg

My graphql config for the data and search
{ use: "@gridsome/source-filesystem", options: { path: "blog/**/*.md", typeName: "BlogPost", resolveAbsolutePaths: true, remark: { externalLinksTarget: "_blank", externalLinksRel: ["nofollow", "noopener", "noreferrer"], }, }, }, { use: "@gridsome/source-filesystem", options: { path: "employees/**/*.md", typeName: "Employees", resolveAbsolutePaths: true, remark: { externalLinksTarget: "_blank", externalLinksRel: ["nofollow", "noopener", "noreferrer"], }, }, }, { use: "gridsome-plugin-flexsearch", options: { searchFields: ["title"], collections: [ { typeName: "BlogPost", fields: ["id", "path", "title", "excerpt", "image"], }, ], }, },

The searchResult function:
searchResults() { const searchTerm = this.searchTerm; if ( searchTerm.length > 2 && this.$search.search({ query: searchTerm, limit: 5 }).length > 0 ) { return this.$search.search({ query: searchTerm, limit: 5 }); } else { return this.$page.posts.edges; } }

Thank you a lot in advance 😄

@travis-r6s
Copy link
Owner

@backurdi That's strange, but thanks for reporting it - i'll take a look at this.

@backurdi
Copy link
Author

backurdi commented Jul 8, 2020

Thank you @thetre97, looking forward to hear what you find 😄

@travis-r6s
Copy link
Owner

Sorry for not replying earlier, but this is to do with Gridsome's asset pipeline, which runs after this plugin gets data from the store - so it will only get the relative path to the image, never the transformed image.

Unfortunately, I'm not sure what I can do here.

@VeliV
Copy link

VeliV commented Nov 8, 2020

Would it be possible to run the the plugin after the build is done?

@travis-r6s
Copy link
Owner

travis-r6s commented Nov 8, 2020

I do intend to update this plugin when I get a bit of time, to use the internal graphql function to query data, instead of getting it from the store. That way, it will get the correct image data, and resolve any relations, use custom resolvers etc as well - which will help solve #56, and #51

@VeliV
Copy link

VeliV commented Nov 8, 2020

That's be great :) I have a hobby site (https://panzercraft.com/) that relies heavily on images. Been playign around with adding search there, but as the site is so image heavy, not being able to get the images show up when searching is a show stopper.

@travis-r6s
Copy link
Owner

@backurdi @VeliV I have just made some changes to this plugin on the graphql branch - if you have the time, would you be able to test this, and check it works for you?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants