Trying to add KeyCloak-js to my webpage via a CDN gives 'The requested module does not provide an export named default"

Question

I am currently testing KeyCloak in a basic Java/Spring Boot application. I am trying to use KeyCloak-JS to manage the session state etc. on the front end. (It seems that doing this on the backend is unnecessarily complicated for my use case)

All the examples that I have found only explain how to use KeyCloak-JS with Angular and NodeJS. However, the applications I wish to secure use Spring Boot as the back end and JSP or Thymeleaf for generating front end web pages.

Because of this, I am trying to load KeyCloak-JS from a CDN. I am pretty unfamiliar with JS Module syntax. Here is the module I have created, It's just a script tag inside of a thymeleaf template.

<script type="module">
        import Keycloak from 'https://cdn.jsdelivr.net/npm/[email protected]/dist/keycloak.min.js';
        keycloak = new Keycloak({
            url: 'http://<keycloask-url>',
            realm: '<realm>',
            clientId: '<client-id>'
        });
        try {
            const authenticated = await keycloak.init();
            console.log(`User is ${authenticated ? 'authenticated' : 'not authenticated'}`);
        } catch (error) {
            console.error('Failed to initialize adapter:', error);
        }
    </script>

And this is the error that I am getting:

Uncaught SyntaxError: The requested module 'https://cdn.jsdelivr.net/npm/[email protected]/dist/keycloak.min.js' does not provide an export named 'default'