AEM LiveReload

Available since version 0.0.2

LiveReload is a browser plugin which automatically reloads browser windows when files change. It uses WebSockets to create a persistent connection to the server. When used with AEM 5.6 or AEM 5.6.1, this feature supports reloading pages when JSPs change. When used with AEM 6.0, it will also listen for client library changes.

  • AEM 5.6.x - Supports reloading pages when any script changes.
  • AEM 6 - Supports reloading pages when any script changes change AND when client libraries change.

For more information on LiveReload, visit http://livereload.com/

Installation

Installation of the ACS AEM Tools LiveReload functionality requires:

Installing ACS AEM Tools

  1. Download and install the latest ACS AEM Tools package and install via AEM’s Package Manager

Installing Netty

  1. Download the Netty content package and install via AEM’s Package Manager

This includes the necessary Netty OSGi bundles.

Install LiveReload Browser Plugin

Browser Plugin

How to Use

  1. After installation steps outlined above are complete, in your Web browser, navigate to the page you will be developing against; in this example: http://localhost:4502/content/geometrixx/en/products.html
  2. Ensure the LiveReload browser plugin is enabled
  3. Push your changes to to AEM (on the AEM install with Netty and ACS AEM Tools LiveReload installed) for the Component or Page under development.

    • LiveReload can be leveraged when vlt’ing files into CRX, deploying via Maven builds or editing in CRXDE/CRXDE Lite.
  4. The browser window opened in Step 1. will automatically refresh and display the changes.

ACS AEM Tools LiveReload Example

Tip: Append ?wcmmode=disabled to the end of the URL in your address bar to avoid loading authoring scripts and reduce refresh times.

Please report any issues with the Feature or documentation on the ACS AEM Tools GitHub Issue tracker.