is there a way to save css/js changes of remote resource between page reloads or map remote resource to local in devtools?

Question

I know about Workspaces recently introduced in DevTools but that is not that i need. For example: page uses jquery that is loaded from CDN, i modify jquery library code, pre

Answer 1

I don't know if this qualifies as an answer, but it is what I am doing, and the closer that I have get to what you want.

I load the page in the browser, and the I do save as in a local file. Note that I am saving the full page, with HTML, js and CSS.

Now, if I want to modify the a CSS, I edit the HTML and direct these file (or files) to my development files.

I reload the page, and now I can work as you want (saving and reloading what I have saved).

Of course that means that you have full access to the files, and most probably they are local, but I don't think that you are really willing to edit the real web files on line.

When I am finished modifying the files, it's just a matter of syncing my dev files with the web files .

Answer 2

You got most of it, but here's the slight change:

Make a change in the Styles pane (or in Sources), then click over to Sources, and when your modified file is open, hit ctrl-s.

Then you can right-click the asset in the Sources list and hit Save As... and save the new modified file to disk.

There is no way to save a modified remote file without persisting it to disk and expect it to be changed on reload.

Answer 3

It is possible, but quite tricky:

• open resources and right clik to the folder with styles\resources (fo not forget to click "allow" on the dialog that appears below the adress bar)
• then right click on the concrete resource and choose "save as" (save it to the working directory that you specified in the prev step)
• then right click to the same resource and choose "Map to file system resource" (write the same name as in prev. step, e.g. all.css but not all.css?id=234234234, just in case)
• modify the styles in the dev tools.
• refresh the page (and realise that all you modifications doesn't applied)
• open resources, find your workspace folder and your resource in it (e.g. all.css)
• right click on that resource and choose "local modifications"
• in opened console click to "apply original content" and realise that you styles has been applied =) It's quit a tricky way and the better idea is to use something like fiddler to replace resources to local files.

Answer 4

I use my apache in debug mode with eclipse so the cahnges are reflected to the site as soon as I save the page.