React-apollo: Unknown directive "client"

[duytq94]

Hi all, first, thanks for watching my issue.
I don't know how to fix this issue when I add "@client" on my gql to query local data, log will be print this error:
I searched but can't find any solution for this issue.
Thanks for help.

[Vladiio]

The same thing. Everything is ok when I query data from my server but I get the error when trying to do one with a client directive.
versions:
"apollo-boost": "^0.1.4",
"graphql": "^0.13.2",
"graphql-tag": "^2.8.0",
"react-apollo": "^2.1.3",

[Vladiio]

I added an empty resolvers object to clientState configuration and everything seems to be alright now. Before that I had only defaults object so I guess we must specify both to get everything work. The fact is documentation says that those are optional.

[duytq94]

Yeah, it seem to add defaults, resolvers object although the docs said it's not require. Thanks @Vladiio

[goodok21]

@Vladiio, can you show the code with comments?

[timbergus]

Hi. Here I have the same error. I have the following code:

__Mutation__
Inside a .graphql file, and imported using WebPack.

mutation Alerts {
  updateAlerts(input: {}) @client
}

__Resolvers__

export const resolvers = {
    Mutation: {
        updateAlerts: () => null
    }
};

__Client__

const client = new ApolloClient({
    link: authLink.concat(httpLink),
    cache,
    clientState: {
        resolvers
    }
});

As you can see, everything is empty to avoid other bugs. And the error I get is:

__Error: GraphQL error: Cannot query field "updateAlerts" on type "Mutation".__
__GraphQL error: Unknown directive "client".__

My idea here is to create a new object inside the Apollo cache to store application alerts state locally, but if it cannot find the mutation, I have no idea how to make it work.

[Vladiio]

@goodok21 I don't have it anymore.
@timbergus I used pretty similar config for client except that I had apollo boost for that. I would suggest you to add defaults object to clientState.

[timbergus]

Thanks, @Vladiio. That is the solution. I have found this amazing VIDEO among the documentation, and the example works like a charm. Once you create an initial state, the rest is using it as a normal server with queries and mutations. You even can see it in the Apollo dev tools in Chrome. Pretty cool :)

[axhamre]

@Vladiio's solution worked for me as well. Here's my setup:

const client = new ApolloClient({ uri: 'https://nx9zvp49q7.lp.gql.zone/graphql', clientState: { defaults: {}, resolvers: {} } });

[EduardoBaez]

Guys! check this Initialize Local State

const client = new ApolloClient({ link, cache, clientState: { defaults, resolvers } })

cache.writeData({ data: { defaults } });

Add this code after initialize ApolloClient, because we need to write initial data to the cache to.

[preciserobot]

I still get the same error in Apollo 2.5 and can't figure out why. I follwed the documentation for Apollo-client 2.5, yet the client directive is still unknown to the client. Is it necessary to manually declare it in the client schema?

Error
{ "errors": [ { "message": "Unknown directive \"client\".", "locations": [ { "line": 6, "column": 13 } ], "extensions": { "code": "GRAPHQL_VALIDATION_FAILED", "exception": { "stacktrace": [ "Unknown directive \"client\".", "", "GraphQL request (6:13)", "5: url", "6: token @client", " ^", "7: decoded", "", " at Object.Directive (/home/dbrawand/dev/sqvd/web/node_modules/graphql/validation/rules/KnownDirectives.js:105:29)", " at Object.enter (/home/dbrawand/dev/sqvd/web/node_modules/graphql/language/visitor.js:333:29)", " at Object.enter (/home/dbrawand/dev/sqvd/web/node_modules/graphql/language/visitor.js:384:25)", " at visit (/home/dbrawand/dev/sqvd/web/node_modules/graphql/language/visitor.js:251:26)", " at Object.validate (/home/dbrawand/dev/sqvd/web/node_modules/graphql/validation/validate.js:63:22)", " at validate (/home/dbrawand/dev/sqvd/web/node_modules/apollo-server-core/dist/requestPipeline.js:175:32)", " at Object.<anonymous> (/home/dbrawand/dev/sqvd/web/node_modules/apollo-server-core/dist/requestPipeline.js:113:42)", " at Generator.next (<anonymous>)", " at fulfilled (/home/dbrawand/dev/sqvd/web/node_modules/apollo-server-core/dist/requestPipeline.js:4:58)", " at /home/dbrawand/.meteor/packages/promise/.0.11.2.fe6u1z.eeraa++os+web.browser+web.browser.legacy+web.cordova/npm/node_modules/meteor-promise/fiber_pool.js:43:40" ] } } } ] }

Package Versions
"apollo-cache-inmemory": "^1.5.1", "apollo-client": "^2.5.1", "apollo-datasource-rest": "^0.3.2", "apollo-link": "^1.2.8", "apollo-link-error": "^1.1.7", "apollo-link-http": "^1.5.11", "apollo-link-rest": "^0.7.0", "apollo-link-retry": "^2.2.10", "apollo-link-ws": "^1.0.14", "apollo-server-express": "^2.4.8", "react-apollo": "^2.5.1",

Apollo client implementation
const cache = new InMemoryCache(window.__APOLLO_STATE); export default new ApolloClient({ // link, link: queryLink, cache, resolvers: { JWT: { token: () => ("Some token") } } });

Query
query { user { jwt { token @client } } }

[hwillson]

@preciserobot Would you mind opening a new issue with the contents of https://github.com/apollographql/react-apollo/issues/1898#issuecomment-469228909?

[kaikun213]

Got the same issue switching to 2.5.1 following the documentation https://www.apollographql.com/docs/react/essentials/local-state.html#migrating

const client = new ApolloClient({
    link: ApolloLink.from([
        // compose Links together (Error checking, Authentication and URL)
        onError(({ graphQLErrors, networkError }) => {
            // TODO: Advanced error handling
            //if (graphQLErrors) { sendToLoggingService(graphQLErrors);}
            //if (networkError) { logoutUser(); }
            if (graphQLErrors) logGraphQLErrors(graphQLErrors)
            if (networkError) console.log(`[Network error]: ${networkError}`);
        }),
        requestLink,
        new HttpLink({
            uri: `${API_URL}/graphql`,
        })
    ]),
    cache,
    resolvers,
});

// New way to set defaults
cache.writeData({
    data: { defaults }
});

export const defaults = {
  projectIndex: 0,
};

[GraphQL error]: Message: Validation error of type FieldUndefined: Field 'projectIndex' in type 'Query' is undefined @ 'projectIndex', Location: [object Object], Path: null

"apollo-cache-inmemory": "^1.5.1",
"apollo-client": "^2.5.1",
"apollo-link": "^1.2.11",
"apollo-link-error": "^1.1.10",
"apollo-link-http": "^1.5.14",

---

PS: removed appollo boost dependency and it seems to work again..

[luismaldonadov]

I've encountered an issue that seems to be related to yours. I've answered here