I want to use Enquire.js in my Vue.js(v 2.0) project. There are a bunch of examples on the internet where users integrating Enquire with Vue.js. For example here: https://jsfiddle.net/Linusborg/843dk9zs/
When I integrate Enquire.js in my Vue.js/webpack project it doesn't work and gave no error messages at all in the console. I don't know exactly what I'm doing wrong here.
This is my code, located in main.js My root file for the application.
import Vue from 'vue'
import Enquire from 'enquire.js' //installed using NPM
require('./stylesheet.css')
new Vue({
el: "#app",
data: {
displayIsLarge: false,
displayIsSmall: true
},
ready: function() {
var self = this;
// Listen for changes in the browser's size
enquire.register("screen and (max-width:400px)", {
match: function() {
self.displayIsSmall = true;
console.log("the screen is now small");
},
unmatch: function() {
self.displayIsLarge = true;
console.log("the screen is now large");
}
})
}