How to my npm package in a way such that people can load it from JSDelivr?

Question

I'm writing an NPM package in typescript for learning purposes. I configured my parcel set up so it exports two kinds of builds, an ESM build and a CJS one. I published it to npm and I can install and use it fine in an ESM-module environment or a cjs environment. like,

const dsa = require('awesome-dsa');
//or
const {SinglyLinkedList} = require('awesome-dsa');

or,

import dsa from 'awesome-dsa';
//or
import {SinglyLinkedList} from 'awesome-dsa';

But I don't understand how include this package with JSDelivr.

I tried both

<script src="https://cdn.jsdelivr.net/npm/awesome-dsa@0.0.5/dist/esm/index.min.js"></script>

and

<script src="https://cdn.jsdelivr.net/npm/awesome-dsa@0.0.1/dist/cjs/index.min.js"></script>

Both of these files exist there are errors in the console.

What should I do?

Answer 1

That was close. You need type=module to import ESM module:

<script type="module" src="https://cdn.jsdelivr.net/npm/awesome-dsa@0.0.5/dist/esm/index.min.js"></script>

But that actually has no effect, instead you can do:

<script type="module">
  import dsa from "https://cdn.jsdelivr.net/npm/awesome-dsa@0.0.1/dist/cjs/index.min.js"
  const q = new dsa.LinearQueue();
</script>