enquire.js
enquire.js copied to clipboard
enquire is undefined
I'm having some trouble with this. I've included it using import via gulp / webpack. the enquire.js code gets included in my main.bundle.js file above the code that references it.
Then, when I try to use it,
enquire.default.register("screen and (max-width:560px)", {
I get error
enquire is undefined
What have I done wrong?
I am also having this issue, "enquire is not defined".
My code is similar to the example codes:
enquire.register("screen and (max-width: 769)", {
match: function() {
// code
},
unmatch: function() {
// code
}
})
note: I am trying to use enquire in React
The same thing here. I've tried to import as follows:
import {enquire} from "/node_modules/enquire.js/dist/enquire.js"
Did anybody find any solution to this issue?
Not ideal but you can use provide plugin:
const webpack = require('webpack');
environment.plugins.append('Provide', new webpack.ProvidePlugin({
enquire: 'enquire.js/src/index.js',
}));
module.exports = environment
For reasons I can't quite recall, the main
field of package.json
is set to ./src
rather than the ./dist/enquire.js
. So currently, you should be able to import enquire like this:
import enquire from "enquire.js/dist/enquire";
Here's a working example: https://codesandbox.io/s/naughty-bash-9q0og. To test you'll need to open this and resize your window: https://9q0og.csb.app/
Actually, I take that back, I can import enquire.js directly, as seen here: https://codesandbox.io/s/adoring-cloud-rfncs
import enquire from "enquire.js";