Vue-devtools: This doesn't work

[ergonomicus]

There is no vue-devtools tab.

[AStaroverov]

me too

[martin-sweeny]

Same here. Installed from the Chrome Web Store and I have no tab in dev tools - but I do have a button in my browser

[yyx990803]

Please read the readme carefully and make sure you've checked the following:

1. [ ] Using a non-minified version of Vue.
2. [ ] Serving the page over HTTP
3. [ ] If the page is opened via file:// protocol, you need to check "Allow access to file URLs" for this extension in Chrome's extension management panel.

If you've done all of the above and the devtool is still not showing up, please provide more information:

• The version of Vue you are using.
• The version of Chrome you are using.
• The OS you are using.

Finally:

1. The tab only shows up when Vue.js is detected on the page.
2. The button on the top right does nothing. Chrome just displays an empty icon for every extension now. You can just hide it.

Issue without proper information doesn't help at all.

[martin-sweeny]

I have no control over your first point because I installed it from Chrome Web Store . The other points are true for me.

[yyx990803]

@martin-wiseweb the first point is referring to the Vue.js you are using in your application, not the devtools.

[ergonomicus]

• Script tag: src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.21/vue.js"
• Chromium browser: Version 49.0.2623.108 Built on Ubuntu 14.04, running on LinuxMint 17.3 (64-bit)
  "Allow access to file URLs" is checked, though I run Apache locally.

I reinstalled extension and still nothing, no tab shown.

[yyx990803]

Are you using self-built Chromium? Do you have the same issue if using the stable-channel Chrome/Chrome Canary?

[martin-sweeny]

I am not using the minified version

[ergonomicus]

@yyx990803 I've just tried with chrome (Version 50.0.2661.94 - 64-bit) and I managed to get it working, sort of. It acts kind of funny. I have to close and open (or hide/show) dev tools, it somehow gets stucked, hard to explain... I think that something goes wrong if I navigate from non-vue page to vue-page...

I will try reinstalling chrome and chromium, and also enabling extensions one by one to see what's going on.

[likeadeckofcards]

@ergonomicus You are not the only one. When I open a page with VUE on it and I don't have the devtools open and active it doesn't always load at all and then when it does load I can't click on anything. If I do click on something, I have to refresh the page in order for it to refresh the devtools panel. I have the most recent version of Chrome and I just installed 1.0.24 of Vue. The Javascript that is compiled from gulp is not minified.

[veksen]

I know this is affecting a lot of people, and it was affecting me as well on the unminified version of Vue. By default, Chrome doesn't show the http:// protocol. I'm developping in a local virtual host served over a host file, say local.dev. Manually typing http:// before the URL got the vue devtools to appear (still chrome doesn't show http://, but vue devtools worked..)

[rodickmini]

Quit Chrome and reopen, and it works fine for me.
Chrome version 51.0.2704.84 (64-bit), Vue.js version 1.0.24
It's odd, 尤老师.

[probil]

Sometimes you need to re-open Chrome DevTools.
Also, if vue loaded inside <iframe></iframe> (jsfidde, jsbin, codepen.io, etc) vue-devtools will not work.

[heiliuer]

It works fine for me by restarting chrome and setting Vue.config.devtools=true.
my version is v1.0.22.

[tevfik6]

Does anyone try to use it for developing chrome extensions?

Due to some requirements @yyx990803 mentioned in his comment, it doesn't work.
I was wondering is it because it's working with chrome-extension:// protocol.

If we could have it work that would be amazing. I'm not able to enable it when I'm developing chrome extensions that is using Vue JS as a library.

Tev.

[johman10]

@tevfik6: I'm in the same situation so I looked around a bit and found that this plugin is actually specifying the protocol it allows to serve over in the manifest file (shells/chrome/manifest.json:22). I tried to force to load it over chrome-extension:// protocol and I did a quick search about this and found this documentation from Google:
https://developer.chrome.com/extensions/match_patterns
This is actually saying a chrome extension is not allowed to load on a chrome-extension:// protocol.

It would have been cool to have this for chrome development but it's not gonna happen.

PS. Sorry for replying to an old issue, just helping the people who run into this problem.