how to include this fancyapps

[JattJames]

Describe the bug

I have a custom.js file and if i do import, i get an error

import { Carousel } from '@js/fancyapps/carousel/carousel.esm.js';
import '@fancyapps/carousel/carousel.css';

import { Thumbs } from '@js/fancyapps/carousel/carousel.thumbs.esm.js';
import '@js/fancyapps/carousel/carousel.thumbs.css';

import { Fancybox } from '@js/fancyapps/fancybox/fancybox.esm.js';
import '@js/fancyapps/fancybox/fancybox.css';

function reloadPage() { window.location.reload();}
$('document').ready(function() {
    document.addEventListener('DOMContentLoaded', () => {

error i am getting

Uncaught SyntaxError: Cannot use import statement outside a module

i am not using node or anything, its just a raw website using these things how can i make it work, there does not seems any documenttation to include directly using script tags

Reproduction

i have already written above how i am trying to call it

Additional context

No response

[fancyapps]

Hi,

Here is an example - https://fancyapps.com/fancybox/getting-started/#cdn - just adjust the file paths if you have downloaded the files and placed them on the server yourself. And check out any JSFiddle demo you can find in the docs, for example - https://jsfiddle.net/tgcpey0m/