AEM Front speeds up development in AEM significantly. It combines AEMSync with BrowserSync, and also works together with the AEM Front Extension for Google Chrome so you don't have to manually inject the BrowserSync script into your code base.
npm install aem-frontAEM Front speeds up development in AEM significantly. It combines AEMSync with BrowserSync, and also works together with the AEM Front Extension for Google Chrome so you don't have to manually inject the BrowserSync script into your code base.
``bash`
npm install aem-front -g
`bash`
aem-front
You can also specify one or multiple of the following options:
`bashCWD
-w: Folder to watch; default is current ()./jcr_root/*, /@(.git|.svn|.hg|target), /@(.git|.svn|.hg|target)/
-t: URL to AEM instance; multiple can be set. Default is http://admin:admin@localhost:4502.
-e: Anymatch exclude filter; any file matching the pattern will be skipped. Default is
-o: Browser page to be opened after successful launch; default is "false".
-b: Browser where page should be opened in; this parameter is platform dependent; for example, Chrome is "google chrome" on OS X, "google-chrome" on Linux and "chrome" on Windows; default is "google chrome".
-i: Update interval in milliseconds; default is 100.
-v: Display version of AEM Front.
Examples:
`bash
aem-front -w "./../sibling/my_project" -e "/webpack.module/" -i "500"
aem-front -t http://admin:admin@localhost:4502 -t http://admin:admin@localhost:4503 -w ~/workspace/my_project
`
- NodeJS and NPM
- Required if you want to use the corresponding Chrome extension: Chrome Browser
1. If you do not have Node and NPM installed, in command line run:
`bash`
sudo brew install node
sudo npm install npm -g
2. Install AEM Front by running:
`bash`
npm install aem-front -g
3. Run the command listed in the "Usage" section in your terminal from a folder where you want to watch file changes. But you can basically run it from anywhere as long as you pass the correct path with the -w option.
4. After successfully starting this script, you can/should install the corresponding Chrome extension. The script injects the required BrowserSync script automatically into your website and comes with a few handy configuration options. But you can also past the BrowserSync script into your website manually. You can install the extension directly from the Chrome app store: https://chrome.google.com/webstore/detail/cmpbphecgagbhhociicpakhddeagjlih
If you clone this project (aem-front) to your local machine and modify it, you can test changes without having to push and publish them to the NPM repository. Do this by linking aem-front globally. In your terminal, run:
`
npm link
Then, in your project where you want to test the local aem-front instead of the one hosted at npmjs.com, run:
`
npm link aem-front
Thanks to the BrowserSync team and to gavoja for aemsync.