search

jsxtools / cqfill

Polyfill for CSS Container Queries
402 stars 4 forks source link

svelte / sveltekit usage #2

Open cbergen opened 3 years ago

cbergen commented 3 years ago

The only way I could successfully import cqfill into a ".svelte" file was like this:

<script>
    // Error: "Uncaught (in promise) TypeError: cqfill is not a function"    
    // import { cqfill } from "cqfill";

    import { cqfill } from '../../node_modules/cqfill/export/cqfill';

    cqfill();
</script>

Not sure if this is a problem with the module or something I'm doing.

bluwy commented 3 years ago

This isn't svelte / sveltekit specific, but more Vite related. The output ESM file seems to not be ESM.

jasikpark commented 2 years ago

in theory, it should be esm, no? https://github.com/jsxtools/cqfill/blob/7fd175ad52ae19dd95af7da3baffdcbabbb30f70/.bin/build.js#L80

jasikpark commented 2 years ago

I believe you need to specify cqfill.mjs rather than just cqfill.js? Maybe there's a package.json config that's incorrect somehow?

bluwy commented 2 years ago

Just got notification on this. Taking another look again, the output is indeed already in ESM, but I have mistaken how the exports work. @cbergen If you want to manually call cqfill(), you should import from cqfill/export instead. Importing from cqfill would run the polyfill automatically, if that's desired.