![]() ![]() The capabilities of LiveReload Tools also removes the need to install the LiveReload standalone application or browser extensions. It enables you to take advantage of LiveReload browser refreshing while editing files within the IDE. LiveReload Tools is tooling that implements LiveReload in the IDE. LiveReload browser extensions are available for Safari, Chrome and Firefox. The LiveReload application is available for OS X and Microsoft Window operating systems and through a third-party provider for Linux-based operating systems. Depending upon the changes to the source, the web page is either reloaded or the browser updated instantly without reloading. Alternatively, it can be inserted manually in the HTML pages. The JavaScript snippet can be installed and activated using a LiveReload browser extension. The server-side and client-side components communicate using the WebSocket protocol, which allows the server-side application to send notifications to the client-side JavaScript snippet. On the client-side, a JavaScript snippet receives the notifications and invokes the browser to refresh the web page. The server-side application monitors the source and sends notifications as the source is changed. ![]() LiveReload consists of server-side and client-side components. Immediate and automatic web page refreshing, without the need to manually refresh, simplifies the workflow of web developers. LiveReload is not an FTP/SFTP client, so if you use the compilers, you need to figure out how to upload their output.LiveReload is an open source tool that refreshes web pages open in browsers as their source is edited. You can also use the same options to preview your local CSS changes against a live web site.Ħ. This supports Espresso, Sublime SFTP plugin and similar cases.ĥ. Also configure “Wait X seconds before doing a full page reload” with an appropriate delay.Ĥ. Enable “Override URLs to serve modified CSS from localhost” in monitoring options.ģ. LiveReload only monitors the local file system, so the code you edit has to be there somehow.Ģ. Please read the knowledge base (search for “remote”).ġ. REMOTE SERVER WORKFLOWS (if your development web site is running remotely): You can add support for your own compilers and editors. Local files (file: protocol) are supported with some limitations.Ĭompilers often work out of the box, but some projects need additional settings or adjustments. Changing any other file (including HTML, PHP, Ruby, etc) triggers an automatic page reload. A nice fat list is hard-coded, but you can add your own ones in monitoring options.ĬSS/image changes are applied live. Only monitors files with specified extensions. QUESTIONS? IDEAS? NOT SURE? THINGS NOT GOING WELL? Just email (or click the Support link on this page). A red dot in the menu bar icon indicates that the browser is connected to LiveReload. Click the browser extension toolbar button if going the extensions route.Įverything should be up and running now. Insert the provided snippet or install the browser extensions.ģ. Add your project folder using the plus button at the bottom (or drag'n'drop).Ģ. You can change that by clicking the gears button in the main window's title bar.ġ. Please read about your specific usage scenarios, frameworks, compilers, editors and browsers in our knowledge base on .īy default, LiveReload lives in the system menu bar on 10.7+ and in the Dock on 10.6. Works with multiple browsers, mobile devices and simulators, even inside preview windows of apps like Espresso and Coda 1. Tested with Rails, Drupal, WordPress, Joomla, ExpessionEngine, Express. Works great with many popular editors: Espresso, Coda 1, TextMate, Sublime Text, BBEdit, SubEthaEdit. The essential web developer tool: When you save a file, LiveReload preprocesses it as needed and refreshes the browser automatically.Įven cooler, when you change a CSS file or an image, the browser is updated instantly without reloading the page.Ĭompiles CoffeeScript/IcedCoffeeScript, Compass/SASS, LESS, Stylus, HAML, Jade, SLIM. ![]()
0 Comments
Leave a Reply. |