NUXT

[avblink]

Hi,

how would you use it with NUXT?

I've created a client plugin and added the following:

import Vue from 'vue'
import MQ from 'vue-match-media'

Vue.use(MQ);

also added mq config on the page:

export default {
  data() {
    return { }
  },
  mq: {
    mobile: '(max-width: 600px)',
  },
}

Then I test it with: <span v-if="$mq.mobile">(mobile)</span>

However when I set v-if="$mq.mobile", I get Cannot read property 'mobile' of undefined error message. The $mq get's populated too late. The only way to solve it, I found, was to use it like this: v-if="$mq && $mq.mobile"

I tried setting default values with Vue.use(MQ, {mq:{.....}}, no luck. Checked the source code, and though it expects options parameter, the parameter does not get used.

Could you please have a look. It's a fantastic plugin, I love the concept, but it would be great to find a solution to the issue.

Thank you in advance. :)