Browser's Debugger Showing Old Code for Vue - vue.js

Sometimes I add a new variable to the Vue data() and get a ReferenceError (like "ReferenceError: windowHeight is not defined"), then when I check the error in the Firefox's debugger, I see that Vue in debugger is the old code not the one I have in my IDE. But when I try the exact same thing in Private Browsing I can see the code being exactly the same as my IDE.
Is this some kind of caching problem? Or is it related to my IDE which is VSCode. And how can I solve it?
I was expecting to see the same code as in my IDE, but during debug I see the old one.

Related

How to stop Electron from printing devtools extension errors to console?

I've been using Vue devtools extension with Electron and whenever I activate and use Vue devtools, all the errors occurred from it gets printed out to the Electron's main process console like this.
It's so frustrating because It's hard to find any useful information printed out from my application in middle of these thousands of errors.
I know why the error occurs. It's because Vue devtools is trying to access the chrome.tabs.captureVisibleTab() function which isn't available on Electron but I don't really care about the errors occurring from Vue devtools here. I just need to stop Electron from printing these errors out. Looked through all of the devtools related documentation but found nothing on this.

IE11 - failed to open http://localhost:8080

I am trying to access my VueJS application running on my node server on IE11 by accessing the URL http://localhost:8080. However I cant access the same as only a blank screen appears. I have babel polyfill installed and imported in my main file and have babel presets already setup in babelrc file.
My app is currently running and is accessible on Chrome but not on IE11.
I don't get a single error message in console and have no clue what could be going wrong. Has anyone ever faced this?
You need to use polyfills. IE11 does not support ES2015, it needs to be transiled by babel. There seem to be various ways of doing this.
Please check this guide: jacklyons.me/how-to-fix-vuejs-not-working-in-ie11
or here: cli.vuejs.org/guide/browser-compatibility.html

How do I check for vue js compilation errors before trying to serve it?

I've just lost a frustrating amount of time trying to work out why npm run serve was hanging when attempting to run my vue js app. Eventually, I tracked it down to one error in a vue file I made, it took me a long time to work this out since the issue manifests itself in a way that the console window just hangs.
Is there some other way developers can get a more descriptive error list from vue js prior to attempting to run/build?
Personally, I find the most useful and essential tools to be (I use VS Code as "IDE")
Vetur: includes syntax-highlighting, snippets, linter (error checking), auto completition, etc.
Vue.js devtools (for chrome): Not sure about other browsers, but this is incredibly useful for chrome. Let's you see what's really going on with vue.js' components, the store, etc (screenshot from the chrome store page).
Hope this helps!

ReferenceError: safari is not defined

Whenever I click on a textarea the following message pops up:
What could possibly trigger this?
Thanks!
Note: I'm using JQM 1.4.5 and the textarea is normal, nothing was configured.
I was having the same issue on one of my projects, with the same traceback as yours. It was strange, as there was no bundle.js in my project, or even being loaded. I found it was an issue with one of my extensions, so disabling extensions and clearing cache should fix your issue.
Are you using chrome browser?
If so, sign out of your chrome browser. That should fix it.
It might be that you have some installed chrome extensions whose javascript codes are conflicting with your project

Chrome debugging of react-native not working

I have been developing with React Native and in the past I was able to debug with Chrome devtools, though it was often sub-optimal and really affected application performance.
Know Chrome devtools just don't work. I try setting breakpoints and they don't set, or jump to some random line far below where I wanted it. I try adding "debugger;" to the code and the debugger does not stop on it.
Nothing seams to work and I have been using console.warn as my debugging, which is not awesome. I have read the docs etc. Any help would be welcome.
Ensure that "JS Dev mode" is on and and "JS minify" is off in Dev settings (Shake menu). In the past this has happened to me on many occasions where I would turn Dev mode off and forget. Breakpoints will not be hit if it's off.