问题
I am using Google Chrome DevTools, and I have to support several projects. I am often editing my source files directly in DevTools, so I added my local source folders to the DevTools workspace. What is bothering me: there seems to be only one workspace, and DevTools only shows the names of the folders I added - which are just 'src' or 'scss' most of the times. So with every new project it becomes increasingly difficult to pick the right folder when I want to open a file.
Is there any way to organize the local folders in DevTools so that I can see to which project they belong? Something like multiple workspaces, virtual folders or symbolic names for the added folders would help, but I couldn't find anything like that in DevTools or in the Chrome extension repos.
回答1:
You can have as many workspaces as you like. You just need to add each project directory.
- Navigate to the root of your project directory in Chrome. This will be your workspace.
- In the Sources panel of DevTools, right click the path and click 'Add folder to workspace'.
- Repeat steps 1 and 2 for the second project directory
Example
The example is with local system files but it will work much the same with a local web server, such as one set up using python -m SimpleHTTPServer 8000.
As you can see, I now have two separate directories so there's no confusion between the apps.
You can add your network mappings either in the Sources tab, or in the Workspaces panel in DevTools settings. I recommend the latter, as it is clearer.
来源：https://stackoverflow.com/questions/39231406/how-to-organize-local-folders-in-chrome-devtools-workspace