0

I am trying to use Third-Party JavaScript Library Swapy in a LWC.

but I get error on the load script

<template>
<div class="list-container">
    <ul id="swapy-list">
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
    </ul>
</div>
import { LightningElement } from 'lwc';
import { loadScript } from 'lightning/platformResourceLoader';
import SWAPY from '@salesforce/resourceUrl/SwapyJS';

export default class TestDrag extends LightningElement {
    swapyInitialized = false;

    renderedCallback() {
         if (this.swapyInitialized) return;
        this.swapyInitialized = true;

        loadScript(this, SWAPY)
            .then(() => {
                // Init Swapy on the list element
                const swapy = new window.Swapy('#swapy-list');
                swapy.init();
            })
            .catch(error => {
                console.error('Failed to load Swapy:', error);
            });
    }

}

I use this script https://unpkg.com/swapy/dist/swapy.min.js that I get from this page https://swapy.tahazsh.com/docs/installation/

the error that I get: window.Swapy is not a constructor

1
  • 1
    Worth a read and a quick try: Light DOM. Just needs a one line addition static renderMode = "light"; to the .js. Commented Jun 23 at 15:29

0

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.