I got a vue-js application with multiple components called index.vue, some nested, loaded at the same time. When I set a breakpoint in Chrome inspector in one of the index.vue files, the debugger halts correctly but opens up the wrong index.vue files. It seems to be related to Webpack sourcemaps config as turning this off files are opened correctly in debugger.
This happened to me too as I was fooling around with debugger keyword. Looks like that throughout the breakpoints chain, if you re-run with an extra (or missing if you have more than 1) debugger keyword, then the breakpoint stops on the correct file!
Crazy dirty workaround but it seems to work for me when not even disabling chrome cache did.
Related
I am currently working with gulp-less workflow with livereload feature of chrome and gulp-livereload is working fine.
When I am making any changes to file, livereload refreshes the css and unfortunately it is injecting livereload css instead of less files.
So I have to refresh the page to show the corresponding less file which is very time consuming and made no use of livereload.
It is totally nonsense to use livereload if I anyhow need to refresh the page to see the less sourcemap files?
Let's say I am generating custom.css file from all the less files but when I change into any partial files, livereload generates sourcemaps and updates custom.css as well in the file system but in browser what I see is only injected css.
See the below screenshot to get the exact issue that I am facing.Note that it also appends some version and port number also after injected css. E.g. css/custom.css?livereload=1577164609829 for my case.
What I am expecting to see on refresh is the corresponding less file in browser and not the injected css through the livereload.
Has anyone faced this issue before? If yes then please help me.
Note: Please don't advice using browser sync or any other instead of livereload.
I'm developing a JavaScript/React application in Intellij Idea and I'm using webpack-dev-server to incrementally build my files. That means that the dev server is watching the files and if a file gets changes, webpack rebuilds it. Pretty standard scenario.
Unfortunately, webpack sometimes decides to ignore certain files. I can change them all I want but webpack does nothing. I have not been able to determine any pattern on which files get ignored. It's arbitrary. Sometimes I just create a new file and webpack ignores it.
What is interesting though is that it only happens when I perform the save using Intellij Idea. If I open the file in another editor (for example vim) and save it, the file gets correctly rebuilt. Actually, simple touch file.js is enough to trigger rebuilding.
I guess there is something wrong in how Intellij Idea saves files. Any ideas?
This is due to an IDE feature known as "safe write". When enabled, the IDE will write the changes to a temporary file over the real one. This means webpack's file watching mechanism cannot pick up the changes. Disable this feature to fix the problem. Reference.
For me this did not work, I'm posting this in case anyone has the same scenario. After each save, webpack watch script builds the new bundles and I'm reloading all files from disk (CTRL + ALT + Y). Only after that the changes are visible.
There is an open issue "Background" changes by external tool not being picked up until VFS refresh happens regarding this behavior: file is saved but one has to reload all from disk in order to see the changes (for example in the browser).
I am not sure why my public assets are not being discovered by play. i am using the same code that works in an activator template in a play2 intelliJ project.
the routes
# Map static resources from the /public folder to the /assets URL path
GET /assets/*file controllers.Assets.at(path="/public", file)
and the html
<img src="#routes.Assets.at(s"images/foo.png")" width="64px">
seem to be correct, and the foo.png is in the public/images folder. the inspector highlights images/foo.png in the html with "cannot find" message. they seem to be being compiled, as they also correctly are placed in the target directory. the rest of the app and html is working fine
what is a possible explanation for this?
Try:
#routes.Assets.versioned("images/foo.png")
Honestly, I have no idea why but I know that it works for me.
Interestingly, there was nothing wrong. it seems that between sbt, play, and IntelliJ, there was simply lag in the resource resolution. after about an hour, everything suddenly worked.
this may not be reproducible, and therefore this question might be a candidate for removal
So if I add break points in .dart files that are located in /web directory of my project, it works fine. For example I'm using AngularDart and the main.dart file works. However when I try to put a breakpoint in anything in the /lib directory, Dartium doesn't stop on them.
How can I get the breakpoints in Dartium to work with the /lib directory?
Note that I've tried putting breakpoints with Dart Editor, IntelliJ with Dart Plugin and also directly in Dartium and nothing works. Is this intended?
To set breakpoints in dependencies search the source inside the (no domain) node and set the breakpoint there. Breakpoints don't hit when set somewhere in the packages node.
You can also use the breakpoint statement for the debugger top pop up. See Does Dart have a 'breakpoint' statement? for more details.
I will combine the accepted answer + comment to that answer. Breakpoints 100% works only when you set them for files inside (no domain) category on Sources tab.
As I understand, in category with your domain name they are working only for files that was included with <script> tag. They won't work for imported files.
I have created an issue: Dartium ignores breakpoints set not in (no domain) category.
If you set break pointors from Dart Editor, then you should run your application from Dart Editor.
If you're using Dartium only, then you should set break pointors from Chrome Developer Tool. (Accepted answer)
So, I'm running an apache server on linux. Sometimes, Firefox decides to not load the new version of a file after I edited it. For example, right now I have a .js file wich is loaded dynamicly. It had a bug, wich I corrected (I checked with Chromium), but when the file is loaded in Firefox, it still has the bug! When looking at the response header of the ajax request, I see the code of the file BEFORE it was changed. But that code doesn't exist anymore... I had this happen with CSS files too.
When I rename the file to something else, it loads the right stuff, but as soon as I rename it to the old name, it starts loading an old version of the file again!
I restarted apache2, but that didn't change anything.
I checked for file permissions too, no problem there as far as I could tell (I changed all files' permissions to rwxrwxrwx to be sure).
When accessing with an other browser, it works fine!
In previous cases, the next day or so, the problem would have vanished, but I can't always just stop for a day in what I'm doing...
This is caused by browser cache,
you can consider to use url with version parameter,
like http://yourdomain.com/js/some.js?v=$version,
and update the $version whenever you update a css/js