Search code examples
webstorm

[WebStorm]: Change Debugging WebServer Project Root

Since recently, I've been using JetBrains WebStorm and I absolutely love it, but I do have an issue, and after hours of searching here and in the documentation, I decided to open my own question because I just don't find it.

I do have a project which is stored on my Local Machine on the following location: C:\Projects\Github\OfficeUI.Beta

Now, I've opened up this folder in WebStorm, which causes it to looks like the following:

enter image description here

When I debug the WebSite right now, everything is running under the following Uri: http://localhost:63342/OfficeUI.Beta/

And there is the issue with it, because it's running in this Directory, in every CSS, JavaScript and other files, I need to place the following: /OfficeUI.Beta/Resources/..., while I would like to use: /Resources/...

How should this be done? I guess I need to modify WebStorm configuration to run the website under the root http://localhost/ but I don't manage to find it.

Any help is highly appreciated.

Solution

  • According to the Help page the URL has to be http://localhost:<built-in server port>/<project root>. There is however a workaround:

    Edit your /etc/hosts file:

    127.0.0.1 projectName

    And set custom port: Settings -> Debugger -> JavaScript -> Built-in server port 8090. In newer version it should be: Settings -> Build, Execution, Deployment -> Debugger

    The URL will be: http://projectName:8090

    Another workaround would be to use the PHP built-in server, where it's possible to define the document root. But this doesn't offer Javascript debugging.