Edit Source File Directly in Chrome
Posted By : Manisha Kirodiwal | 29-May-2018
Sometimes for a developer, it is hard to finding and fixing errors can be difficult. You may be urged to randomly use console.log () in an attempt to make your code work properly.
Earlier we use separate applications for development and browsing but now its almost come to an end. We can edit source files directly in Chrome and it will save the result to a local file. So that Changes can be applied immediately without refreshing the browser.It saves are time a lot.
Following local saving of code technique should work in newer versions of Chrome, but now we can edit and save only JavaScript files. HTML and CSS are almost sure to be supported at last.
Follow the following steps:
1: Launch Developer Tools
Open Chrome, load the page from your local file system/server
Open Google Developer Tools using the Tools menu or press Ctrl + Shift + I / Cmd + Shift + I.
Navigate to the Source tab, and then click the Sources icon or press Ctrl + O to select your JavaScript file.
2: Edit Your Code
Now jump right in your file and edit your code. Google Chrome provides a very useful property list that helps you find the right line - press Ctrl + Shift + O / Cmd + Shift + O:
3: Save the File
Press Ctrl + S / Cmd + S to save your new changes.
This change updates the file in the memory and applies the new changes hand to hand. Note, however, that the code does not restart, so changes in initialization variables are not overridden.
If you want to save the changes to the original code file, right-click the edit and select Save or Save as... When done, you need to refresh the page and the code script restarts.
4: Undo Your Mistakes
Has your update caused some issues? Right-click on the chrome dev tool editor and select Local changes
This Chrome's developer tools
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Manisha Kirodiwal
Manisha is a Web Application developer and she is good in working with Angular, TypeScript , JavaScript and Jquery. In free time she loves to dance and cooking.