Error: libheif.HeifDecoder is not a constructor

[dukesook]

I'm trying to run libheif.js directly into an HTML page, but I'm getting the following error: libheif.HeifDecoder is not a constructor. Any ideas on what the problem is?

index.html

<script type="module" src="image_parser.js"></script>
<script type="module"> 
   import libheif from 'https://cdn.jsdelivr.net/npm/libheif-js@1.17.1/libheif-wasm/libheif-bundle.mjs'; 
</script>

image_parser.js

import libheif from 'https://cdn.jsdelivr.net/npm/libheif-js@1.17.1/libheif-wasm/libheif-bundle.mjs';
const decoder = new libheif.HeifDecoder();

[stevenheffner]

@dukesook

If you are pulling from the libheif-bundle you need to init the module with a function call.

  const libheif = window.libheif()

  const decoder = new libheif.HeifDecoder()

You can see this is done for you in wasm-bundle.js

module.exports = require('./libheif-wasm/libheif-bundle.js')();

[dukesook]

Thanks @stevenheffner, but they gave me the following error:

window.libheif is not a function

I posted my attempt at using libheif.js here. Are there any glaring mistakes?

[catdad]

@dukesook here's a codepen I made showing off how to use the esmodule version from jsdelivr: https://codepen.io/catdad/pen/jOJpVJV

Let me know if this helps or if you still have any issues.

[Duefectu]

It worked for me!
Thank you!

[dukesook]

It worked for me! Thank you!

@Duefectu
The codepen is working great, but when I try to create my own .html & .js files I get an error. Would you mind sharing your code?

[d-hand]

@dukesook
example.zip

[dukesook]

@d-hand
The example worked, thank you!