GraphQL support in the JSS Vue.js sample app
The sample application supports using Sitecore GraphQL to enable accessing content or other custom data schemas (for example, aggregating an existing set of backend REST services).
Sitecore GraphQL does not come with a disconnected mock service, so it can only operate with a JSS app running in connected, integrated, or headless application modes. If you require disconnected GraphQL functionality, graphql-tools has very powerful GraphQL mocking capabilities.
The remainder of this topic describes using GraphQL in connected mode.
Do not confuse connected application mode with connected GraphQL.
The Vue sample app uses the @vue/apollo library, which in turn integrates with the Apollo GraphQL client. Follow the @vue/apollo
documentation for usage and implementation details.
When server-side rendering (SSR), the sample app uses the prefetch
functionality of @vue/apollo
to prefetch GraphQL query data and render the app to HTML on the server. This allows SSR with the async results of GraphQL queries evaluated. If not using GraphQL, you can remove the @vue/apollo
prefetching functionality.
Complete examples of using connected and integrated GraphQL are provided in the folder src/components
and contain documentation comments. For example, src/components/GraphQL-ConnectedDemo
shows you how to use connected GraphQL. Please refer to these samples for implementation details.