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

11 comments

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

1

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

0

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

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?

0

>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

1

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

 

0

>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.

1

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)

 

 

-1

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 example

0

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.

And why on earth do Webstrom provide a webserver if they know that its webroot is incorrectly configured?

-2

>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

0

Please sign in to leave a comment.