VuePress 1.x Import Vue.js Component: Vue Toasted

Edit docs/.vuepress/enhanceApp.js

// import Toasted from 'vue-toasted';export default ({  Vue, // the version of Vue being used in the VuePress app  options, // the options for the root Vue instance  router, // the router instance for the app  siteData // site metadata}) => {  /*  Vue.use(Toasted, {    duration: 6000  });   */  import('vue-toasted').then(module => {    Vue.use(module.default, {      duration: 6000    });  }).catch(error => {  });}

Without .catch(error => { ... }), the following warning shall appear during build (yarn docs:build)

(node:7226) UnhandledPromiseRejectionWarning: ReferenceError: window is not defined
    at Object.<anonymous> (15.server-bundle.js:7:52389)
    at e (15.server-bundle.js:7:185)
    at Object.<anonymous> (15.server-bundle.js:7:20076)
    at e (15.server-bundle.js:7:185)
    at Object.<anonymous> (15.server-bundle.js:7:2540)
    at e (15.server-bundle.js:7:185)
    at Object.<anonymous> (15.server-bundle.js:7:18822)
    at e (15.server-bundle.js:7:185)
    at 15.server-bundle.js:7:574
    at 15.server-bundle.js:7:583
    at exports.modules.203.n (15.server-bundle.js:7:39)
    at Object.203 (15.server-bundle.js:7:62)
    at __webpack_require__ (server-bundle.js:27:30)
    at module.exports.__webpack_require__.t (server-bundle.js:84:33)
    at <anonymous>
(node:7226) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 3)

In component file

<template>
  <div>
    ...
  </div>
</template>

<script>
export default {
  mounted () {
    this.$toasted.shoe('Hello');
  }
}
</script>

References:

https://github.com/shakee93/vue-toasted