Let users know when they are offline with this Vue component


A reactive offline indicator component for Vue.js which shows a message when the user is offline.


Import it to use it as component

  import { OfflineIndicator } from 'vue-online'

  export default {
    name: 'app',
    components: {

Use this custom component in the template

    <div id="app">
      <img src="./assets/logo.png">

Apply any style to the indicator

  div.offline-indicator {
  background: red;
  color: white;

Head to GitHub for more, and give it a star if you liked it!