LiveReload: The Spring Boot DevTools module includes an embedded server called LiveReload. It allows the application to automictically trigger a browser refresh whenever we make changes in the resources. It is also known as auto-refresh. Note: We can disable the LiveReload by setting the property spring.devtools.livereload.enabled to false.
- LiveReload浏览器扩展程序支持Chrome,Firefox和Safari,你可以从livereload.com免费下载。 如果你不想在应用程序运行时启动LiveReload服务器,则可以将spring.devtools.livereload.enabled属性设置为false 。 同一时间只能运行一个LiveReload服务器。.
- I really love this extension. But I am very UPSET that they did not create an add on for firefox quantum. So, I can not use firefox for the lack of livereload as I work on dual monitor. Without livereload, it is very boring to hitting refresh. PLEASE MAKE ONE FOR FIREFOX QUANTUM.
- LiveReload 0.6.4 ([email protected]).mozilla/ ├── appreg ├── eclipse ├── extensions ├── firefox │ ├── 5q0epjhm.default │ ├── Crash Reports │.
- Running as Firefox OS App. To run this application in Firefox as a packaged app, open 'Menu' - 'Developer' - 'WebIDE' (or hit Shift + F8). Choose 'Open packaged app' from the Project menu and select the app folder. Run npm start (gulp watch) to watch for file changes and automatically rebuild the app. Running in production.
- Details
- Written by Nam Ha Minh
- Last Updated on 26 February 2020 Print Email
In addition to automatic restart on changes feature, the Spring Boot DevTools module also comes with an embedded LiveReload server that can be used to trigger a browser refresh whenever a resource is changed. For example, when you make some changes to a template file, the browser automatically refreshes the page uses that template – you see your changes take effect in action – no need to press F5 again and again – saving you a lot of time.In this post, you will learn to use LiveReload with Spring Boot DevTools to significantly reduce waiting time in developing Spring Boot projects – increase your productivity.Using LiveReload for auto-reload changes is pretty easy. Here are the steps:
- Add the dependency spring-boot-devtools to your project’s build file (pom.xml).
- Install LiveReload extension for your browser.
- Restart your Spring Boot application.
That’s it, and you’re all set. Enjoy better Spring Boot development experience.
1. Install Spring Boot DevTools
So, make sure that you have the following dependency in the Maven’s build file:If you are using Spring Tool Suite IDE, right-click on the project, then click
Spring > Add DevTools. Start your Spring Boot application, and you will see LiveReload server is running by default:
2. Install LiveReload extension for your browser
Go to http://livereload.com/extensions/ and click on the link that relates to your browser. Currently, it supports Safari, Chrome and Firefox. For example, I’m using Chrome so I got this:Click Add to Chrome. and click Add extension when asked. Then you will see the LiveReload icon appears to the right of the address bar like this:You can click that icon to enable/disable LiveReload on a specific page in the browser. When the extension connected to LiveReload server, the small circle at the center becomes a filled dot. If not, you will see this error message:
3. What will trigger a browser refresh?
Any changes you made to a resource (Java code, HTML, properties file, etc) in the classpath will trigger a restart plus a browser refresh. In addition, changes to resources in the following directories also trigger a live reload:
/META-INF/maven
,
/META-INF/resources,
/resources,
/static,
/public, and
/templates
.
4. Disable LiveReload server
To disable LiveReload server when your Spring Boot application is running, specify the following property in the
application.properties file:
spring.devtools.livereload.enabled=false
Then restart the application.Thanks to Spring Boot DevTools that makes Spring Boot development much more convenient. You can also watch this video to see how to use Spring Boot DevTools in action:
Reference: Using Spring Boot – Developer Tools
Other Spring Boot Tutorials:
About the Author:
Nam Ha Minh is certified Java programmer (SCJP and SCWCD). He started programming with Java in the time of Java 1.4 and has been falling in love with Java since then. Make friend with him on Facebook and watch his Java videos you YouTube.
Use Oracle JET CLI to launch your hybrid mobile application in a browser, simulator, or mobile device for testing and debugging. When you serve your application to a browser or emulator, a live reload option is enabled, and changes you make to the code are immediately reflected in the running application.
Before you begin:
- Familiarize yourself with the
ojet serve
command option theme
when you want to run the application with an optional platform and a custom theme, as described in Customize Alta Themes Using the Tooling. - Optionally, use the
ojet serve
command with the --release
option to serve a release-ready version of your application, as described in Package and Publish Hybrid Mobile Applications. - If you want to send your application to an iOS device, you must take additional steps as described in Package a Hybrid Mobile App on iOS.
At a command prompt, change to the application’s top level directory and use the ojet serve
command with options to launch the application.
Tip:
You can also enter
ojet help
at a terminal prompt to get help for specific Oracle JET CLI commands.
Livereload Firefox Extension
The application will launch in a local browser, emulator/simulator, or device depending upon the options you specify. The following table shows examples.
Command | Description |
---|
ojet serve windows -–browser=firefox
| Launches a Windows version of the application in the Firefox browser. |
ojet serve ios
| Launches the application in the iOS Simulator using the Alta iOS theme. |
ojet serve android --destination=emulator:MyEmulator
| Launches the application in the Android emulator using the AVD named “MyEmulator”. The emulator name is case-sensitive. |
ojet serve android --device
| Launches the application on the attached Android mobile device. |

The terminal will also output the names of the files as they are loaded. If your application contains multiple views, the output will reflect the names of the views and associated files as you navigate through the application.
WARNING:
If you specify the Android platform, use a proxy server and skipped the
ojet build
step, the
serve
command will fail the first time you issue it. To resolve this, create a
gradle.properties
Livereload Sublime Firefox
file in your
HOME/.gradle
Firefox Livereload Not Working
directory and rerun the serve command. The file should contain the following:
If you left live reload enabled (default, --livereloadtrue
), the terminal window updates to reflect that the code has changed. For example, if you save a change to dashboard.html
in an application scaffolded with the navbar or navdrawer template, the terminal window outputs the name of the changed file, and the browser or emulator/simulator updates with the change. Live reload is disabled when you serve an application to a device.
To terminate the batch job when using live reload, press Ctrl+C in the command window and then enter y
if prompted to terminate the batch job.
About ojet serve Command Options for Hybrid Mobile Applications
Livereload Firefox Sublime Text 3
Use ojet serve
to run your hybrid mobile application in a local web server for testing and debugging.
Livereload Extension Firefox
The following table describes the commonly-used options and provides examples for their use.
Livereload Firefox
Option | Description |
---|
[ios android windows]
| Desired platform. Enter android , ios , or windows . |
build-config
| Specify the path to buildConfig.json . The buildConfig.json file contains details that Cordova can use to sign the application. You do not need this file when building a debug version of your application for Android or Windows, or if you are building your app for deployment to an iOS simulator. However, you must configure one for testing on an iOS device and for pre-release testing of your Android, iOS or Windows application. |
server-port
| Server port number. If not specified, defaults to 8000. |
livereload-port
| Live reload port number. If not specified, defaults to 35729. |
destination
| Specify one of the following: emulator : Displays your application in the default Android AVD, iOS Simulator, or Windows Emulator.
To use a different emulator, append its name to the emulator option: --destination=emulator:emulator-name . Tip: You can view the list of available emulators for each platform by invoking the following from your app's top-level folder: hybrid/platforms/{platform}/cordova/lib/list-emulator-images
where {platform} is one of android, ios, or windows. browser : Displays your application in the Chrome browser on your local machine.
If you don’t have Chrome installed or want to use a different browser, append the name of the desired browser to the browser option: Tip: To change your application’s default browser from Chrome, open oraclejetconfig.json in the application's top level directory and change the name of the browser in defaultBrowser . For example, to change the default browser to Firefox, edit oraclejetconfig.json as shown below. device : Sends the application to an attached device.
Optionally, append the name of the device to device option: --destination=device:myDevice . server-only : Serves the application, as if to a browser, but does not launch a browser. Use this option in cloud-based development environments so that you can attach your browser to the app served by the development machine.
|
browser[=browser-name]
| Equivalent to destination=browser[:browser-name] . |
emulator[=emulator-name]
| Equivalent to destination=emulator[:emulator-name] . |
device[=device-name]
| Equivalent to destination=device[:device-name] . |
server-only
| Equivalent to destination=server-only . |
livereload
| Enable the live reload feature. Live reload is enabled by default (--livereload=true ). Use --livereload=false or --no-livereload to disable the live reload feature. Disabling live reload can be helpful if you’re working in an IDE and want to use that IDE’s mechanism for loading updated applications. |
build
| Build the app before you serve it. By default, an app is built before you serve it (--build=true ). Use --build=false or --no-build to suppress the build if you’ve already built the application and just want to serve it. |
theme
| Theme to use for the application. The theme defaults to redwood for hybrid mobile applications. Note: If you have migrated to JET 9.0.0 and later, and want to continue building with your Alta theme, for hybrid mobile themes, you can specify: alta:android , alta:ios , alta:windows ). Note that the Alta theme is supported through JET 10.0.0 but is expected to become deprecated beyond that. For details about migrating applications, see Oracle JET Application Migration for Release 10.0.0. You can also enter a different themename for a custom theme as described in About CSS Variables and Custom Themes in Oracle JET for Redwood themes and, for a migrated custom Alta theme, in Customize Alta Themes Using the Tooling. |
themes
| Themes to use for the application, separated by commas. If you don’t specify the --theme flag as described above, Oracle JET will use the first element that you specify in --themes as the default theme. Otherwise Oracle JET will build the application with the theme specified in --theme . |
--cssvars
| Injects a Redwood theme CSS file that supports working with CSS custom properties when you want to override CSS variables to customize the Redwood theme. For details about theming with CSS variables, see About CSS Variables and Custom Themes in Oracle JET. |
sass
| Manages Sass compilation. If you add Sass and specify the --theme or --themes option, Sass compilation occurs by default and you can use --sass=false or --no-sass to turn it off. If you add Sass and do not specify a theme option, Sass compilation will not occur by default, and you must specify --sass=true or --sass to turn it on. For details about theming with Sass, see Work with Sass. Note: The option that you choose controls both Sass compilation in the build step and Sass watch in the serve step. |
platform-options
| Platform-specific options that will pass verbatim to the Cordova CLI. This option is typically required for Windows device deployments or if a Cordova plugin contains multiple static libraries for different CPUs. If the value passed contains a quoted string, the quotation marks must be escaped. For example, you can use platform-options to specify Windows architectures. By default, the architecture defaults to anycpu . To specify a single architecture, use the --arch option and specify arm , x86 , x64 , or anycpu . |