60

我正在尝试在新的 React 项目中设置 Apollo GraphQL 支持,但是当我尝试使用编译查询时,gql我一直收到错误消息:

语法错误:预期名称,找到 }

这是由以下代码生成的:

import gql from 'graphql-tag'

const query = gql`
    {
      user(id: 5) {
        firstName
        lastName
      }
    }
  `

console.log(query)

我将此代码基于此处找到的示例代码:https ://github.com/apollographql/graphql-tag

Name错误消息中提到的是什么?有谁知道我在这里做错了什么?

4

11 回答 11

50

此错误主要发生在有未闭合的大括号或调用查询时未正确定义某些字段时。

于 2018-04-02T12:33:09.103 回答
30

接受的答案并没有解决我的问题。相反,如果您删除最初的大括号,它会起作用。

查询应如下所示:

const query=gql`
  user(id: 5) {
    firstName
    lastName
  }
`
于 2018-07-17T20:34:46.907 回答
12

原因可能是:

  • 您无缘无故地在开头添加“()”
  • 您需要添加更多“嵌套”参数。

特别是如果您使用的是在线 GraphiQL 编辑器。例子:

1- 错误代码(额外括号)

{
  allFilms() {
    films {
      title
    }
  }
}

2- 错误代码(更多参数需要它,例如:标题)

{
  allFilms {
    films {         
    }
  }
}

3-正确的代码

{
  allFilms {
    films {
     title         
    }
  }
}
于 2020-10-07T17:53:49.927 回答
7

我不是 100% 确定我的问题的根源是什么,但是将所有查询代码移动到一个单独的 es6 模块中解决了这个问题。周围的代码一定有某种污染。作为参考,我的查询嵌入在 React 组件中。

这有效:

import gql from 'graphql-tag'

const query = gql`
{
  user(id: 5) {
    firstName
    lastName
  }
}
`

export default query
于 2018-01-23T15:48:23.620 回答
6

GraphQLError:语法错误:预期名称,找到“$”。

类似错误的另一个示例(对于其他用户)。

theErrorIsHere(可以是额外的({$varName)之前添加的$speakerId

错误代码:

const FEATURED_SPEAKER = gql`
  mutation markFeatured($speakerId: ID!, $featured: Boolean!){
    markFeatured(speaker_id: theErrorIsHere$speakerId , featured: $featured){
      id
      featured
    }
  }
`;

错误输出

正确代码:

const FEATURED_SPEAKER = gql`
  mutation markFeatured($speakerId: ID!, $featured: Boolean!){
    markFeatured(speaker_id: $speakerId , featured: $featured){
      id
      featured
    }
  }
`;
于 2020-10-13T15:51:51.183 回答
5

导致此错误的另一个原因:您正在引用进一步定义的类型。向上移动要引用的类型。

例如:

    type Launch {
        rocket: Rocket
    }

    type Rocket {
        name: String
    }

将引发错误,因为之前的Launch引用已定义。 RocketRocket

更正后的代码:

    type Rocket {
        name: String
    }

    type Launch {
        rocket: Rocket
    }
于 2019-05-07T23:43:46.160 回答
1

我收到了类似的错误服务器端:

GraphQLError: Syntax Error: Expected Name, found ]

我意识到我的原因是一个空数组的类型定义。

这打破了:

  type Settings {
    requires: []
  }

但这有效:

  type Settings {
    requires: [String]
  }
于 2020-06-11T20:04:12.937 回答
1

我遇到了这个问题,原因是双引号内带有双引号的字符串值,如下所示:"this "is" bad".

于 2021-03-25T22:15:46.080 回答
1

就我而言,由于以下原因,我收到了错误:

const GET_POSTS_OF_AUTHOR = gql`
  query GetPostsOfAuthor($authorId: Int!) {
    postsOf($authorId: Int!) {
      id
      title
    }
  }
`;

什么时候应该是:

const GET_POSTS_OF_AUTHOR = gql`
  query GetPostsOfAuthor($authorId: Int!) {
    postsOf(authorId: $authorId) {
      id
      title
    }
  }
`;

错误地认为 $authorId 与函数调用相同地传递,而不是在函数调用中设置属性。

于 2021-06-20T06:52:31.667 回答
0

在任何一方,错误是由额外的 {} 花括号引起的。只需删除它们即可解决。

于 2021-06-02T02:35:21.370 回答
0

就我而言,我收到错误只是因为我添加:了我不应该做的事情。

例如:

const query = `
   query($id: String!) {
      getUser(id: $id) {
        user: {
          id
          name
          email
          createdAt
        }
      }
   }
`

如果您密切注意上面代码的第 4 行,您会发现我:在大括号之前添加了用户之后,然后我开始列出我要查询的用户数据,而这正是错误所在!删除:解决问题!

它应该是:

user {
   id
   name
   ...
}
于 2021-11-02T21:48:58.353 回答