Allow use of $buefy in plugins

[JacobKorn]

Background

I was trying to use the $buefy instance in my own plugin (basically a facade for toasts and snackbars) but I could not access $buefy from my plugin.

eg:

export default ({ app: { $bus, $buefy } }, inject) => {
  console.log('buefy', $buefy) // undefined
  console.log('bus', $bus) // bus object
}

This pull request allows you to get the buefy instance from the nuxt context.

eg:

export default ({ $buefy, app: { $bus } }, inject) => {
  console.log('buefy', $buefy) // BUEFY
  console.log('bus', $bus)  // bus object
}

[jtommy]

The PR would be ok but for your purpose you can import the single components, don't you?

[JacobKorn]

I'm using it for programmatically opening snackbars and toasts in a consistent manner, eg:

export default ({ $buefy }, inject) => {
  inject('toasty', {
    message (message) {
      $buefy.toast.open({
        message,
        pauseOnHover: true,
        type: 'is-info',
        duration: 5000,
        position: 'is-top-right',
        queue: false
      })
    },

    error (message) {
      $buefy.toast.open({
        message,
        pauseOnHover: true,
        type: 'is-danger',
        duration: 5000,
        position: 'is-top-right',
        queue: false
      })
    }
  })
}

Then from anywhere in the components I can just do this.$toasty.error('message').

The main goal is consistency and easy of use, but it also means I can swap out a different toast library later if need be and keep the same interface.

I'm relatively new to plugins and modules in Nuxt, so I'm open to better ways of doing this.

[jtommy]

import { Toastprogrammatic as Toast } from 'buefy'
..
Toast.open(...)

https://buefy.org/documentation/toast#from-outside-vue-instance

[JacobKorn]

Ah, that should do the trick. I should have read further down the documentation.

Thanks.