Last update: December 22th, 2017
Vue.js Inspector for Mobile Devices
vue-inspector is a basic inspector for Vue.js that works with mobile devices. It could work in a desktop environment, but I do not recommend that; use Vue.js devtools instead.
With vue-inspector is possible to execute JavaScript code directly in your mobile browser and get error messages generated at run-time. Also inspect the data, props, router links, views/components, computed properties, routes and more... inside your Vue.js project.
- Works with Vue.js 2
- Reactive (of course)
- Instance routes, data and computed properties inspection
- Integrated JavaScript (basic) console for code execution and messages/errors logging
- Navigation inside components and their children (with inspection)
- Responsive and simple UI
- Supports vue-router
Installing with npm:
npm install --save-dev vue-inspector
Using Yarn:
yarn add --dev vue-inspectorThe following properties are available:
| Property | Required | Default value | Description |
|---|---|---|---|
| is-visible | false | true | Start visible |
| is-minimized | false | true | Start minimized |
Use vue-inspector only in development mode. Do not forget to remove the script and style files before sending to production.
This script is intended only for browsers running on Mobile Devices, that lacks of JavaScript console.
Download or clone this repo and open the folder demos, or open the following links using your mobile browser:
- Simple demo
- vue-router demo
- webpack demo (download the project)
I have tested this tool only with Android phones and tablets. If you have information about the compatibility with iOS, or/and other mobile browsers, please let me know to update this list. I will appreciate any collaboration with compatibility testing. Currently tested/compatible with:
- Firefox for Android
- Google Chrome for Android
- Events logging
- Vuex support (state management) (In progress)
Component rewrite(Done)Support for vue-router(Done)- Support for Nuxt (In progress)
Publish npm module(Done)- Update screenshots
- Add CDN (the project needs at least 200 stars on GitHub)
- December 22th, 2017
- Improved support for vue-router
- Fixed issue with Vuex
- Version 0.3.1 released
- npm package updated to 0.3.1 (please, update your vue-inspector version)
- December 21th, 2017
- UI updates
- Component rewrite
- Component prop is-expanded removed
- Project's structure changed
- New demos added
- Version 0.3.0 released :)
- December 19th, 2017
- New demo added for webpack integration.
- December 16th, 2017
- vue-inspector, beta 0.2 released.
- Added support for vue-router.
- New demo created/added, using vue-router to demonstrate how the integration works.
- Tested in Mozilla Firefox for Android. It works :)
- December 14th, 2017
- vue-inspector, beta 0.1 released.
Copyright (c) 2017, Cali Rojas