Using the Vue DevTools plugin to track our Vuex state
If you type vuejs devtools
into the search field of the Chrome extensions web store, you'll get a few results. The first result is the stable version of the official plugin. The second result is the Vue DevTools extension's beta version. To see all of the options that are being developed and see where this plugin is going, it's good to install the beta version. Interestingly, both versions display the same information once open in Chrome DevTools. Currently, the message reads Ready. Detected Vue 2.5.17-beta.0
.
When compared with the regular version, the experimental version comes with a few more tabs, namely routing
and p
erformance
. However, even the existing tabs have some very useful improvements. For example, the Vuex tab comes with the ability to directly update the state from inside DevTools. To access that functionality, simply open Chrome DevTools by pressing the F12 key. The best way to position the DevTools to use the Vue extension...