We made a plugin that integrates Apollo into vue-devtools!

Link to plugin here

Over the past couple of weeks, I’ve really enjoyed using Pinia due to its fantastic integration with vue-devtools which allows you to see every change.

We also use GraphQL via Apollo extensively and wanted to experience the great DX experience of Pinia for Apollo within vue-devtools.

At first, we initially thought we could put all the API data within Pinia. However, this would add a lot of dev overhead. During development, we’d need to write to Pinia to call the API. This would also have the con of decreasing API performance.

Turns out, there’s a better way! Inspired by Pinia’s integration, we’ve made an open-source plugin that allows you to visualise every time an API request is sent/received.

This is incredibly useful as it will enable you to see the API response without going to the network tab or switching context to the Apollo devtool.

Would love the community to try this out and let us know your thoughts!

1 Like