在开源LWC中导入第三方JS库

问题描述

在浪费大量时间来导入jQuery之后， 我有以下两种方法 在具有本地路径或CDN的HTML中：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

具有本地路径或CDN的IN JS：

var script = document.createElement('script');
script.src = 'https://code.jquery.com/jquery-3.4.1.min.js';
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);

但是不幸的是，以上两种方法都无法在LWC中使用，并且也没有有关如何执行此操作的文档。

下面的方法在我的index.html页中可以很好地在我的lwc项目中导入jQuery。

<script src="./resources/js/jquery-3.5.1.min.js"></script>

我也浪费了很多时间在lwc中导入CSS，因为也没有关于导入第三方CSS的文档，但是我是如何使用下面的代码来导入css的

constructor() {

    super();

    const styles = document.createElement('link');
    styles.href = './resources/css/bootstrap.css';
    styles.rel = 'stylesheet';
    this.template.appendChild(styles);
}

所以我尝试了一些类似的方法来导入JS，这在控制台日志中没有给出任何错误，但是完全不起作用，在构造函数和connectedCallback中都尝试过，但是没有运气。

connectedCallback() {
        const jq = document.createElement('SCRIPT');
        jq.src = './resources/js/jquery-3.5.1.min.js';
        jq.type = 'text/javascript';
        this.template.appendChild(jq);
    }

如果有人对如何在开源LWC中导入JS库有任何想法，请告诉我，非常感谢您的帮助。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）