I am trying to get a demo app that uses Hasura and Gatsby started (https://github.com/praveenweb/dynamic-jamstack-gatsby-hasura/tree/master/dynamic-auth-client).
I edited the gatsby-config.js file with my Hasura endpoint URL, but I get the following error.
ERROR
UNHANDLED REJECTION Type HASURA must define one or more fields.
Error: Type HASURA must define one or more fields.
gatsby-config.js
module.exports = {
siteMetadata: {
title: "projectname",
siteUrl: `https://www.myurlhere.com`,
},
plugins: [
`gatsby-plugin-react-helmet`,
`gatsby-plugin-sitemap`,
{
resolve: `gatsby-plugin-nprogress`,
options: {
// Setting a color is optional.
color: `tomato`,
// Disable the loading spinner.
showSpinner: false,
},
},
{
resolve: "gatsby-source-graphql",
options: {
typeName: "HASURA",
fieldName: "hasura",
url: "https://myurlhere.com/v1/graphql",
},
},
],
}
I found I only need to make the typeName: "Query" and the fieldName: "blah".
Error: Invariant Violation: gatsby-source-graphql requires option `typeName` to be specified
{
resolve: "gatsby-source-graphql",
options: {
// This type will contain remote schema Query type
typeName: "Query",
// This is field under which it's accessible
fieldName: "blah",
// Url to query from
url: "http://10.113.34.59:4000/graphql",
// this is URL where served exposed its service in local
},
Related
I am trying the GraphQL for the first time. I have a express-graphql server connected to MySQL for hypothetical juice shops, where a owner has ability add or remove or rename the serve type.
For example
Shop A has serves like "Cute Small","The Regular" and "Extravaganza"
Where as shop B serves like "Xsmall","small","medium","large" and "Xlarge"
As the GraphQL fields are mandatory, I am unable think of solution for this particular scenario.
In short, I would love to know if there is a way to write a GraphQLObjectType where the fields can be any/not mentioned.
Snippet of a menu type, were the fields is very specific
var typeDef = new GraphQLObjectType({
name: "Menu",
fields: {
name: { type: GraphQLString },
small_serve: { type: GraphQLFloat },
regular_serve: { type: GraphQLFloat },
medium_serve: { type: GraphQLFloat },
large_serve: { type: GraphQLFloat },
},
});
GraphiQL
{
menus{
name,
small_serve,
regular_serve,
medium_serve,
large_serve
}
}
Don't get the query to contentful to work.
Receive error message:
TypeError: Cannot read property 'allContentfulMagArticle' of undefined
datais undefined inside the Posts component. Can't see what i'm doing wrong here.
import { graphql } from 'gatsby';
import Post from "./post.js";
import './posts.css';
export const query = graphql`
query {
allContentfulMagArticle{
edges{
node{
index
title
name
subHeading
extract {
raw
}
slug
}
}
}
}
`
const Posts = ({ data }) => {
return (
<section className="posts">
<ul className="post-list">
{data.allContentfulMagArticle.edges.map(({ node }) => (
<Post
key={node.index}
id={node.index}
node={node}
title={node.title}
name={node.name}
// image={node.frontmatter.featuredImage.childImageSharp.fluid}
subheading={node.subheading}
body={node.extract.raw}
/>
))}
</ul>
</section>
)
}
export default Posts
Here my gatsby-config.js:
require('dotenv').config({
path: `.env`,
})
module.exports = {
siteMetadata: {
title: `XX`,
description: `XX`,
author: `Lisa Lee`,
url: `https://www.tortmagazine.com`
},
plugins: [
`gatsby-plugin-react-helmet`,
'gatsby-plugin-fontawesome-css',
'gatsby-plugin-sharp',
`gatsby-transformer-sharp`,
`gatsby-transformer-remark`,
{
resolve: `gatsby-source-filesystem`,
options: {
path: `${__dirname}/src/`,
},
},
{
resolve: `gatsby-source-contentful`,
options: {
spaceId: process.env.GATSBY_CONTENTFUL_SPACE_ID,
accessToken: process.env.GATSBY_CONTENTFUL_ACCESS_TOKEN,
},
},
],
}
You used the word "component" to describe your Posts but the query you are using only works in a page, or in the context of createPage (so in a template file as well). If you are indeed in a component, that will be the issue. If not, then I'm not clear what is wrong, I use the same pattern (eg: data.edges.node.map()) and it works for me.
The only other difference I noticed is in gatsby-config, I define an environment key. I'm not sure what the behavior is if none is defined, probably defaults to master so you may also want to confirm you're on the right environment.
I am new to GatsbyJs - GraphQL, I have been exploring the example provided by gatsby(https://github.com/gatsbyjs/gatsby/tree/master/examples/using-gatsby-source-graphql), As I tried with local apollo-grapql server, It returns data in the front-end, However it throws above error and blocks the build process, not sure what exactly is typeName I need to pass it in here? any help one this would be much appreciated.
`gatsby-source-graphql`,
{
resolve: "gatsby-source-graphql",
options: {
// This type will contain remote schema Query type
typeName: "Query",
// This is field under which it's accessible
fieldName: "blah",
// Url to query from
url: "http://10.113.34.59:4000/graphql",
// this is URL where served exposed its service in local
},
`gatsby-source-graphql`, <==== this caused the issue
{
resolve: "gatsby-source-graphql",
options: {
// This type will contain remote schema Query type
typeName: "Query",
// This is field under which it's accessible
fieldName: "blah",
// Url to query from
url: "http://10.113.34.59:4000/graphql",
// this is URL where served exposed its service in local
},
Below worked fine
{
resolve: "gatsby-source-graphql",
options: {
// This type will contain remote schema Query type
typeName: "Query",
// This is field under which it's accessible
fieldName: "blah",
// Url to query from
url: "http://10.113.34.59:4000/graphql",
// this is URL where served exposed its service in local
},
I have a stitched graphql schema. Some type fields are resolved with info.mergeInfo.delegateToSchema
Here's an example (which is from the apollo docs):
const mergedSchema = mergeSchemas({
schemas: [
transformedChirpSchema,
authorSchema,
linkTypeDefs,
],
resolvers: {
User: {
chirps: {
fragment: `... on User { id }`,
resolve(user, args, context, info) {
return info.mergeInfo.delegateToSchema({
schema: chirpSchema,
operation: 'query',
fieldName: 'chirpsByAuthorId',
args: {
authorId: user.id,
},
context,
info,
});
},
},
},
});
Is it possible to access root in chirps resolver? So that in the root there were all the parent fields? Another way is, of course, to use context for this purpose, but using root, I guess, would be better from a code perspective as I'm already using root value in some cases.
Under the hood info.mergeInfo.delegateToSchema can call remote GraphQL application (more details).
So by design remote resolver don't have access to local root/context/info/arg, you need send all required data in arguments for remote field. For example:
const mergedSchema = mergeSchemas({
schemas: [
transformedChirpSchema,
authorSchema,
linkTypeDefs,
],
resolvers: {
User: {
chirps: {
fragment: `... on User { id }`,
resolve(user, args, context, info) {
return info.mergeInfo.delegateToSchema({
schema: chirpSchema,
operation: 'query',
fieldName: 'chirpsByAuthorId',
args: {
// author is InputType at remove schema with similar user structure
author: user,
},
context,
info,
});
},
},
},
});
I don't know your case, but don't forgot about schema-transforms during working with remove schemas.
When I try to run it, It is giving me the error.Trying to delete using Mutation but its giving the error saying "authorsCollection.delete" is not a function
const Mutation = new GraphQLObjectType({
name: "Mutations",
fields: {
DeleteAuthor: {
type: Author,
args: {
_id: {type: new GraphQLNonNull(GraphQLString)},
name: {type: GraphQLString},
},
resolve: function(rootValue, args) {
let author = Object.assign({}, args);
console.log(args);
return authorsCollection.delete(author._id)
.then(_ => author);
}
}
What should be edited in the code so that I can implemented the Delete operation?
It is giving me the error as below
{
"data": {
"DeleteAuthor": null
},
"errors": [
{
"message": "authorsCollection.delete is not a function",
"locations": [
{
"line": 2,
"column": 3
}
]
}
]
}
The error message authorsCollection.delete is not a function indicates that authorsCollection does not have any function named delete. In your jsfiddle code, I see you have used promised-mongo library. The API to remove documents is remove, not delete.
Change to
authorsCollection.remove({_id: ObjectId(author._id)})
The _id passed is a string. But the _id property of author in DB is of type ObjectID. So, you have to convert it to ObjectID type. You do so by using promised-mongo's ObjectId. So, import it in the beginning:
import {ObjectId} from 'promised-mongo';