Problem with Document root
Been trying to figure this one out, have started a simple webpage to build a bootstrap. The root directory is
~/Development/WebstormProjects/cc-bootstrap
And I want the root directory to be, well, ~/Development/WebstormProjects/cc-bootstrap, but it seems to be ~/Development/WebstormProjects
So basically, when I try to load an image, I can not find it using /img/bg, but I have to put it in as cc-bootstrap/img/bg.
Found the instructions for Preferences -> Directories, and think I have set it correctly, but it really is refusing to let me access resources without adding cc-bootstrap. Settings can be seen below.

Any suggestions what I am missing?
IDE Info:
Custom plugins: [Material Theme UI (2.4.2-2018.1), Markdown support (181.4668.12), PostCSS support (181.4892.29)]
Disabled plugins:[IdeaVim (0.49)]
Build version: WebStorm 2018.1.5 Build #WS-181.5281.31 June 14, 2018
Java version: 1.8.0_152-release-1136-b39x86_64
Operating System: Mac OS X (10.13.5, x86_64)
JVM version: OpenJDK 64-Bit Server VM JetBrains s.r.o
Please sign in to leave a comment.
The built-in webserver serves files from
http://localhost:63342/<project root>. Forward slashes in URLs tell the browser to resolve them relative to the web server root (localhost:63342), causing 404 errors.If you like to use URLs relative to server root (the ones starting with slash), you have to change the default web path on built-in web server (to map your project to the server root). To do this, you need editing your system hosts file accordingly - see http://youtrack.jetbrains.com/issue/WEB-8988#comment=27-577559. Or, just use a 'normal' web server (Apache, etc.) to host your files and configure it in the way you like
Elena Pogorelova: Thank you very much for the quick response.
Am at a bit of a loss though, how do I access the internal server, tried to follow your link but could not quite see which section was relevant.
Wen't through the preferences for webstorm, but really could not find it
It can't be configured in WebStorm own preferences; you have to edit your system hosts file (/etc/hosts) to map 127.0.0.1 to your project name, and then use http://yourProjectName:port to access your app. see instructions in https://youtrack.jetbrains.com/issue/WEB-8988#focus=streamItem-27-577559-0-0
So this is a bug then?
Only assuming as this isn't how it used to work, and it seems like for some reason Webstrom have changed it behaviour to open its webserver one level up, hence making certain that I have to either restructure my live servers to have an extra directory to be able to map it identically to my IDE, or continuously creating new hosts in /etc/hosts?
Or am I missing something?
>So this is a bug then?
No - it works as designed; several WebStorm projects can be open in parallel and internal web server serves them all, that's why we cannot use project root as server document root.
>Only assuming as this isn't how it used to work, and it seems like for some reason Webstrom have changed it behaviour to open its webserver one level up
It has always worked this way, nothing has changed. You can use a different web server (Apache, etc.) if the way applications are served by built-in webserver doesn't meet your requirements
I think we are talking cross purpose here.
The index.html is located (and the webpages root) is ~/Development/WebstormProjects/cc-bootstrap
The directories setting for the directories to map against (in preferences) is ~/Development/WebstormProjects/cc-bootstrap
But the mapping provided by webstorm is ~/Development/WebstormProjects, so to access it, I need to use [hostname:port]/cc-bootstrap
And it definitely used to be that it shared the root of the project, not the parent directory of the project, as this approach breaks any usage of absolute path when developing using the Webstorm
>And it definitely used to be that it shared the root of the project, not the parent directory of the project
No, it had never worked this way.
This mean that you can't develop html pages on webstorm without spending a ton of time rewriting any absolute paths when you deploy a project to a production environment, and as I try to use absolute paths, I would have to do that a lot.
For example, if I have a logo in my index.html, I would have written the link img src="/img/logos/brand.jpg", not img src="/projectname/img/logos/brand.jpg" then upload it and go in and manually edit every src statement.
Is there a tool to overcome this rather serious limitation with the IDE (other than installing numerous webservers or edit your hostfile continuously)
No tools. Editing hosts is the only possible workaround. You can try simple web servers available on the web - https://github.com/indexzero/http-server#readme. You just need installing it with npm (
npm install http-server -g), and then run it in your project dir with npm script, for exampleSo how do I tell the shortcut on the screen (the one that opens the webbrowser to use the new http address instead of the broken one that Webstrom provides.
And why on earth do Webstrom provide a webserver if they know that its webroot is incorrectly configured?
>So how do I tell the shortcut on the screen (the one that opens the webbrowser to use the new http address instead of the broken one that Webstrom provides.
You have to set up your web server as default for your project. Please see https://confluence.jetbrains.com/display/PhpStorm/Deploying+PHP+applications+with+PhpStorm#DeployingPHPapplicationswithPhpStorm-1.Configuringadeploymentserver
I agree with Bengtbj - simple things should be simple. Look on live server extension for vs code as an example of a good solution (https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer). As simple as one click.
Guys, just my 2 cents here... I understand Elena's position and yes, you can always use an external webserver to get the job done exactly how you want, however, I believe the voice of customers is pretty clear here. This is a useful thing and it should be a fairly simple one, so yes, it deserves attention.
It's 2 years later and we still have this same behaviour.
For the people here who still struggle with that, just leave me a note and I will be happy to share my settings (I've manage to get it working as it was supposed to, but its a pain).
Hi Leni, I've been trying to read up on this for hours now. If you're still happy to share your settings I'd be very grateful!
Hey Leni, I'm struggling with this as well. Can you share your settings, if you don’t mind?