【Browser】Chrome Workspace --- save the changes you edit in developer tools

1. Open the Developer Tools Experiments .If you use Canary, you can skip to step 3.

        In browser, go to "chrome://flag" , enable "Developer Tools Experiments"

 

2.Restart chrome

 

3.Enter developer tools setting 

 

 

4.Enable Workspace function (Developer tools -> setting -> Experiments -> File system folders in Sources 

  

 

5.For safety, chrome require a ".allow-devtools-edit" file in the file systems you have to set later.

For example, I use "F:\x_project\octjs"

IN windows, cmd:

"echo  > .allow-devtools-edit" or "copy con .allow-devtools-edit"

 

Then it will create a file.

 

6.Restart develop tool, there is a workspace area. Enter it andset it. For example, I use "F:\x_project\octjs", and its remote is "https://github.com/younglaker/octjs" which is a project i write recently , a small javascript library.

 

 

7.Restat developer tools, in source panel,you can see two files, a local and a remote. 

 

 

Choose remote file to edit. It useless to edit local files.

 

 

8. For example, change the corder color in source panel, press "ctrl + s" to save, then it will update automatically in sublime.

 

Before:

 

 

After:

 

 

≡≡≡≡≡≡≡≡≡≡★ From Laker's blog ★≡≡≡≡≡≡≡≡≡≡

¤　╭⌒╮☀Coding and Changing~☀ ╭╭ ⌒╮

✪Fighting and Insisting~✪