A big update was released to the Vue devtools just a few days ago. Let’s dive into the new features and improvements! 🎄

Editable component data

You can now modify the data of your component directly in the Component inspector pane.

  1. Select a component
  2. Under the data section in the inspector, mouse over a field
  3. Click on the pencil icon
  4. Submit your changes by clicking on the done icon or by hitting Enter. You can hit Escape to cancel the edition

The content of the field is the serialized JSON value. For example, if you want to enter a string, type "hello" with the double-quotes. …


Declaratively attach GraphQL queries to your components

Editor’s note: This post is from Guillaume Chau, an Apollo contributor who built an integration package between VueJS and Apollo. Check it out and contribute to it here!

As you may know, the Apollo team has built a great GraphQL client and tooling that makes it easy to use data from your server in any JavaScript app. Why not use it with another amazing technology like VueJS?

Now you can do just that with vue-apollo, an npm package I wrote that allows you to write GraphQL queries in your VueJS components while using Apollo under the hood.

Image for post
Image for post

Use it in your VueJS app

First, install these packages in your project…

About

Guillaume CHAU

JavaScript enthusiast | Vue.js Core Team

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store