Must use import to load ES Module: swiper.esm.js

Platform

• JavaScript

Author or host

Yes

Version of SDK

"adaptive-expressions": "^4.19.1",
"adaptivecards": "^2.11.2",
"adaptivecards-templating": "^2.3.1",
"swiper": "^9.0.5"

Issue

I am trying for adaptivecards templates to work consistently and I get really strange issues with some cards. So I just tried to make a very simple js script to test different templates with data. Unfortunately I get problems with carousel.js trying to use swiper which for some reason I had to add manually.

internal/process/esm_loader.js:74
internalBinding('errors').triggerUncaughtException(
^

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: = ./adaptivetemplating/node_modules/swiper/swiper.esm.js
require() of ES modules is not supported.
require() of ./adaptivetemplating/node_modules/swiper/swiper.esm.js from ./adaptivetemplating/node_modules/adaptivecards/lib/carousel.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename swiper.esm.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from ./adaptivetemplating/node_modules/swiper/package.json.

at new NodeError (internal/errors.js:322:7)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1131:13)
at Module.load (internal/modules/cjs/loader.js:979:32)
at Function.Module._load (internal/modules/cjs/loader.js:819:12)
at Module.require (internal/modules/cjs/loader.js:1003:19)
at require (internal/modules/cjs/helpers.js:107:18)
at Object.<anonymous> (./adaptivetemplating/node_modules/adaptivecards/lib/carousel.js:42:16)
at Module._compile (internal/modules/cjs/loader.js:1114:14)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1143:10)
at Module.load (internal/modules/cjs/loader.js:979:32) {

code: 'ERR_REQUIRE_ESM'
}

The code is simple and although not fully tested always gives the swiper error:
import * as ACData from "adaptivecards-templating";
import * as Adaptive from "adaptivecards";
var fs = require("fs");

console.log("template:",process.argv[2])
console.log("data:",process.argv[3])

const cardtemplate = fs.readFileSync(process.argv[2]);
const carddata = fs.readFileSync(process.argv[3]);

var adaptiveCard = new Adaptive.AdaptiveCard();
var template = new ACData.Template(cardtemplate);
console.log("ctemplate:",template)
var context = {
}
context.$root = JSON.parse(carddata);
var cardPayload = template.expand(context);
console.log("card2:",cardPayload)
adaptiveCard.parse(cardPayload);
console.log(adaptiveCard.render());

A general comment on the actual usage of Adaptive Cards Templates [which I got working in a browser but not consistently takes all example files] is the
var context: ACData.IEvaluationContext = {
$root = {
"name": "Adaptive Cards"
}
};
where ACData.IEvaluationContext is not easy to get to work on javascript / nodejs / typescript.
It would be easier to have a ACData.Context(somejson)?