https://vanillawebdev.blogspot.com/2025/03/css-background-image-issue-white-flash.html
https://vanillawebdev.blogspot.com/
https://vanillawebdev.blogspot.com/2025/09/auto-open-project-folder-devtools.html
Auto Open Project Folder DevTools Workspace
September 20, 2025
2025
September
20
11:14 AM
You can auto open a project folder as workspace in Chrome DevTools. Workspace allows you to edit the project files directly from DevTools.
Previously, it is done manually by selecting the project folder to open as workspace. Now, DevTools can recognize the project folder by reading the com.chrome.devtools.json file inside the project folder.
 |
| DevTools workspace auto open project folder. |
Here's an example of com.chrome.devtools.json for ChromeOS:
{
"workspace": {
"root": "/media/fuse/crostini_..._termina_penguin/my-project/src",
"uuid": "53b029bb-c989-4dca-969b-835fecec3717"
}
}It contains the absolute path of the project folder. The documentation provide an example script to generate the file.
Now, where do we store it?
For example, if you're serving src folder as localhost:4200, then the project structure would look like this:
.
└── my-project/
├── src/
│ ├── .well-known/
│ │ └── ...
│ └── index.html
└── server.jsIf you have everything set up correctly, the next time you refresh the page, the project folder will be shown in the DevTools workspace menu, which you can grant permission to open it as a workspace.
***
https://www.blogger.com/comment/fullpage/post/8166404610182826392/8150479972211212286
https://vanillawebdev.blogspot.com/2025/03/css-background-image-issue-white-flash.html
https://vanillawebdev.blogspot.com/