gatsby

问题 I am working with gasby and here the main file is always layout.js which is the parent of them all. Since it is a parent file then how can I get a location props this.props.location.pathname inside it? Here is my layout component class Layout extends Component { componentWillMount() { console.log(this.props, 'dssssssssssssf') } render() { const { children } = this.props return( <StaticQuery query={graphql` query SiteTitleQuery { site { siteMetadata { title } } } `} render={data => ( <> <div>

问题 In the Contentful CMS, I have two different content-types: BigCaseStudy and BigCaseStudySection . To get this content to appear in my Gatsby 2.x site, my thinking was: Do query 1, which gets all the BigCaseStudy fields I want to display, and also contains the content's ID field as metadata. Take that ID from query 1, match to a Contentful reference field (which contains an ID ) in query 2 Do query 2, return all matching BigCaseStudySection fields The end goal would be to display the original

问题 I am trying to useStatic Query and GraphQL to get a simple title from Contentful, pass it to state and then show in the render. I cant make it work. I am attaching an image showing my current setup and errors. Possible problems: 1. the query returns an array, and I need to change it into a string, or access 0 element, the first one, because my content type is just one, as it is a onepage. Placing of the query in the component, I am not sure if it can be in the constructor of an component For

问题 I'm using gatsby to create a simple blog. When I try to search for an specific image, I get an error from graphql. I have the following configs: installed "gatsby-image": "^1.0.55" graphql` query MainLayoutQuery { heroImage: imageSharp(id: { regex: "/hero.jpg/" }) { id sizes(quality: 100) { base64 tracedSVG aspectRatio src srcSet srcWebp srcSetWebp sizes originalImg originalName } } } ` when I run that query in graphql ui I get: { "errors": [ { "message": "Cannot read property 'id' of

问题 How to specify background image in global SASS stylesheet? Within the "src" folder I have a "sass" folder contain a stylesheet with the following: background-image: url(../assets/test.jpg) The "assets" folder is on the same level as the "sass" folder. I addition to the path above, I have also attempted using "./" and "../../" to no avail. Error: ERROR in ./src/assets/test.jpg 1:0 Module parse failed: Unexpected character '�' (1:0) You may need an appropriate loader to handle this file type.

问题 You can see I'm logging the data returned from my lambda function. The data is definitely coming back as expected. However, in the createPage(...), the allMessages in pageContext in the dashboard.js component is always null/undefined. Why?... dashboard.js const DashboardPage = ({ pageContext: { allMessages } }) => ( <Layout> <SEO title="Dashboard" keywords={[`gatsby`, `application`, `react`]} /> <h1>Dashboard</h1> <p>Welcome to your new Gatsby site.</p> {console.log('allMessages: ',

问题 So I've written a blog site in Gatsby and Remark. I've structured my posts like this: Library/ -- category-name/ ---- article-name/ ------ index.md This has worked really well and results in me being able to make paths like /category-name/article-name . What I also would like to do is to be able to drop an image in there called 'hero.jpg' and for it to be automatically picked up by Gatsby without having to add a frontmatter reference to it. I've managed to get so far by adding the following

问题 I have Gatsby as my frontend and NodeJs/Express to fetch API data. I edited gatsby-config.js with the following module.exports = { /* Your site config here */ proxy: { prefix: "/api", url: "http://localhost:4000", }, } to make this work. It works in my development environment, but not when I run the gatsby production build. When I run the gatsby production build and go to the live production website, the nodeJS API data is not being fetched. I'm I missing a build step. I do gatsby build

问题 Recently I built a Gatsby project and deployed it on AWS Amplify using the Amplify Console and connecting my Bitbucket repo. The project grew and now it has to build 37 pages with a ton of images. I am using ‘gatsby-source-custom-api’ for the data extraction which offers image processing using ‘gatsby-image’. It also offers a way to specify if the images was changed therefore if not changed it uses the .cache to get it already optimized by the ‘gatsby-image’. Now the issue I face is that the

问题 So I'd like to query a single JSON file which is not an array from Gatsby's GraphQL but I don't really know how to do it. As far as I understand gatsby-transformer-json docs - it only supports loading arrays and have them accessible via allFileNameJson schema. My gatsby-config plugins (only the necessary ones for this question): { resolve: 'gatsby-source-filesystem', options: { name: 'data', path: `${__dirname}/src/data` } }, 'gatsby-transformer-json' And then let's say in src/data i have a