New HTML5 Boilerplate Project fires up a server on http://localhost:63342/ but no resource files like CSS/JS are accessible

Hi,

I've never tried this feature before with PhpStorm. I am curious about it. I created a new HTML5 Boilerplate project and can easily open the file by right-clicking and choosing Run or Open in Browser.

This feels like it is working okay, and I see that it launches something at http://localhost:63342/, but I notice that it is not finding any of the nearby css or js files that come with the boilerplate.

It would be great if those could be served out as well on this little server.

What is the localhost:63342 server? Is it a tiny instance of one of the familiar web servers or anything like that? Can I tell it to serve the css, img, and js, that is next to the index.html file it serves out?


Thanks in advance

1 comment
Comment actions Permalink

Hi there,

It's a built-in simple web server.

It uses URLs like "localhost:63342/ProjectName/index.html" and requires some ID to identify what project to serve. In "normal" web server (ordinary site on Internet) it will be a host/domain name; here it's the ProjectName.

You can read a bit more here: https://confluence.jetbrains.com/display/PhpStorm/Using+the+Built-in+Webserver+in+PhpStorm

Because it requires such section in the URL .. it's not really possible to use resources (css/js/images/etc) where they have URLs relative to the site root (e.g. "/assets/js/my.js" -- notice the leading "/") or if you define base for URLs on a page. Relative URLs (to current page; without leading "/") will still work OK.

Your options are:

  1. do not use built-in server -- use your own (Apache/IIS or whatever)
  2. use slightly modified URL, like "ProjectName:63342/index.html" -- for that you will have to edit your "hosts" file or your local DNS server (if you have one) to make ProjectName resolved into an IP address.


BTW -- IDE uses built-in server only if you do not specify your own in Deployment. Once you create and configure Deployment entry (e.g. In Place type) and mark it as Default .. it will use URL defined there to open your files in browser. You will also have to use this if you want to use option #2.

0

Please sign in to leave a comment.