Hi everyone,
I’m using the vaadin-component-factory/vcf-splide add-on (extending Splide class). The component works and is visible perfectly in development or via java -jar locally with `-Pproduction, but fails immediately production deployed to AWS.
In the browser console, I get: Uncaught TypeError: Cannot read properties of undefined (reading 'Media')
This points to the internal Vaadin-generated chunk, specifically where the connector tries to initialize the slider options.
I tried running mvn clean package -Pproduction and deleted node_modules/package-lock.json to get a new updated build.
I also tried overriding the imports in my Java class to force the full bundle, but the error is still there.
@NpmPackage(value = "@splidejs/splide", version = "3.6.12")
@JsModule("@splidejs/splide/dist/js/splide.min.js") // Tried .esm.js too
@CssImport("@splidejs/splide/dist/css/splide.min.css")
public class ImagesCarousel extends Splide { ... }
So at this point I’m quite lost on how it works when implementing add-on components.
Thanks in advance!
EDIT: I figured it out. Turned out to be a two-part problem involving both the Vaadin/Vite build process and the AWS ECS deployment pipeline. The console error was indeed caused by Vite aggressively tree-shaking the Splide library in production mode and the fix was actually importing the .min.js bundle. Though the real reason why it was failing on AWS it’s because ECS was aggressively caching the old Docker image, so I tagged the new image with a unique version and updated ECS Task Definition to get specifically the new tag.