window.Filterizr is not a constructor OR Uncaught SyntaxError: import declarations may only appear at top level of a module OR Uncaught (in promise) TypeError: Filterizr is not a constructor #190
Description
I get some of these errors from Getting started page
import Filterizr from 'filterizr'
// Configure your options
const options = { /* check next step for available options */ };
// Adjust the CSS selector to match the container where
// you set up your image gallery
const filterizr = new Filterizr('.filter-container', options);
Uncaught SyntaxError: import declarations may only appear at top level of a module
If I copy paste code from the demo I get "window.Filterizr is not a constructor "
If I tweak the code like so I get:
<script src="filterizr.min.js" type="module"></script>
<script>
async function main() {
const Filterizr = await import("./filterizr.min.js");
const filterizr = new Filterizr('.filter-container');
}
main();
</script>
Uncaught (in promise) TypeError: Filterizr is not a constructor
How do I use it in a normal way without NPM?
<script src="vanilla.filterizr.min.js"></script>
<script>
Filterizr('.filter-container');
</script>
Uncaught TypeError: this is undefined
t http://localhost:8000/vanilla.filterizr.min.js:1
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"
></script>
<script src="jquery.filterizr.min.js"></script>
<script>
window.Filterizr('.filter-container');
</script>
Uncaught TypeError: t.shuffle is undefined
What am I doing wrong?