I'm making changes locally to my code. When I save the code in Atom, then refresh over localhost, the changes are not being displayed in the browser. What are the possible reasons for this?
Not really a solution, but mistakes that I sometimes do:
1. Cross check carefully if its the same file that your are editing, and the one that's run in the terminal, and browser.
2. Also carefully check, when you save the file, is the terminal refreshing the client, or restarting the server.
I have highlighted carefully, because it's happened to me, and I have seen it happen with my colleagues.
try ctrl+f5 to refresh browser.
or open dev tool in browser then check "disable cache" on settings (chrome)
If clearing cache resolves issue, then from next time you can use browser in incognito, or use this chrome ext https://chrome.google.com/webstore/detail/cache-killer/jpfbieopdmepaolggioebjmedmclkbap
Clear cache in the browser, check to make sure Atom is saving the file in the right place and not else where on the computer other things to try is edit the file in notepad or notepad++ and save it and see if it changes. As it could be atom its self not working correctly..
Related
I'm trying to debug a javascript file, but whenever I use the Chrome Devtools, a random old JS file opens instead. I haven't been able to move on with my project because of this. Does anybody know why it won't read the current file? You can see down on the gif that I am using index.js but every time I debug it opens a random file and reads that instead.
GIF OF THE ERROR
It could be a problem with caching. Try using a silent browser and disabling caching
enter image description here
The browser caches your old JS file. So what you can do on Chrome is perform a hard refresh with CTRL + Shift + R while the dev tool is open.
If your project uses webpack. Make sure you keep it running. The VScode extension LiveServer will take changes but will only work with the JS file you had the last time you ran it.
When I upload any changes in javascript files to my deployed site on Google cloud compute engine, the changes do not show up right away, if I load the js files in browser. The changes are physically there, validated by RDPing to the server. B
These changes sometime take 6 to 8 hours to show up in browser, and sometimes show up sporadically. What can I do to ensure that my changed js files take effect immediately on load?
I dont face this problem when I upload on my test server, which is not under cloud. Happens only on the google cloud server.
Try opening your builtin browser debugger (for example right-click on your page, if using Chrome, and click "Inspect"). Now select the Network tab. Now reload. Now look at the sizes of the files. If they are very small, then probably the browser loaded cached copies. You can verify this by checking the "Disable cache" option in the Inspector.
If it works correctly and the file updates right away when you have the browser cache disabled, then you need to investigate with your web server software to see how to cause it to invalidate caches. One mechanism you can look into is called "ETags."
What worked was invalidating the cloud cache for the file. Lesson learnt: always add version numbers to your js files.
I'm working with Wamp, and i just added a console.log line.
console.log("message);
However, the message isn't being displayed in the console. After a bit of research, i found out that the source code of the page displayed on my browser ISN'T including the console.log line.
It seems like Wamp isn't recognizing the changes in my code all of a sudden.
I tried restarting it but still the same issue. Any ideas ?
This is javascript you are amending. Javascript is cached in the browser, so if you make a javascript change on the server it is sometimes necessary to tell your browser to refresh all its cache's.
You do this by loading the page you want to see and then pressing CTRL+F5 (both together) The browser will reload the page and all its resources, bringing up your amended javascript from the server in the process.
My problem is when I edit my previous javascript or css file link to my html file, the function/code that I add are not functioning even I delete the whole code in my js file. The previous code only is functioning.
It might be your cache were not deleted ,that's why it still using your previous javascript file.
To fix that:
Empty your cache
(In GoogleChrome ) Open developer tools( or press F12 ) then You can right click on
refresh and select Empty Cache and Hard Reload
Your updated javascript now will be loaded.
CLEAR GOOGLE CHROME CACHE
CLEAR FIREFOX CACHE
CLEAR INTERNET EXPLORER CACHE
What server software are you hosting with? Apache? Express/node?
I noticed depending on how I configured something like forever or nodemon to host my express sites, it did not reflect changes when not using grunt. I had to restart them to get them to use the newly changed files.
Did you use a Yeoman generator?
If I'm editing a javascript file in VI, I'd like it to somehow refresh the browser as soon as I save my file without me having to switch to the browser window and press F5. (I'm using a transparent terminal so I can see the browser through my code). What's the best way to do this?
This has been answered here:
Using vim, how do you quickly refresh a web page you're working on?
I like the look of http://xrefresh.binaryage.com/
Check this out: Automatically refresh browser in response to file system changes?
Here's a python script which works with all browsers and can use multiple browsers simultaneously. It currently only works on linux though. http://code.google.com/p/reloader/