Live Preview URL Mapping
Live Preview currently opens the local page directly in (Chrome) browser using the file protocol, as in file:///path/to/index.html. This limits development to only document-relative (
) and absolute URLs (<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>) and client-side HTML documents.
This proposal will allow Live Preview to open pages under a local server so paths that have to be interpreted by a server such as site-root-relative (
) and protocol-relative URLs (<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>) and server-side file extensions (such as .php) can be used in Live Preview. Also, .shtml pages with include files can also be used in Live Preview.
The backlog entry is in Trello.
A Gear icon will be placed next to Project name (and drop down menu). Clicking this icon opens a preferences dialog.
Dialog wil have 2 fields:
- Base URL
) and text field (specify base URL)
- Validate that local file URL exists
- Add field where user can list supported server-side file extensions? There are too many to hard-code: .shtm/.shtml, .php/.php3/.php4, .cfm/.cfml, .asp/.aspx, .jsp, etc. What is reasonable default list?
Base URL maps to the root folder of the project
- Assume server path structure mirrors folder structure on disk
It would be helpful to have an option to make Live Preview open up documents with a custom local domain such as localhost, as in http://localhost/path/to/index.html.
- Once base URL specified, Live Development button is clickable while any file open (not just .html)
- Message shown if you click Live Development button with other file type open suggests defining a base URL for local server