如何将HTML文件与来自node_modules的js文件连接?

时间:2019-05-31 14:27:11

标签: javascript angular sip sipjs

我正在尝试将\node_modules\sip.js\dist\sip.min.js添加到我的html文件中。我试图将import * as SIP from 'sip.js/dist/sip';导入我的component.ts中,但是仅当我从中调用某些函数时,此方法才起作用。但是我需要我的html文件才能阅读此sip.min.js

我也尝试在本地下载此文件并添加到我的html文件中

       <script src="js/sip-0.5.0.js"></script>
       <script src="js/ua.js"></script>

并添加:

   public loadScript() {
        console.log("preparing to load...");
        let node = document.createElement('script');
        node.src = this.url;
         node.type = "text/javascript";
        node.async = true;
        node.charset = "utf-8";
        document.getElementsByTagName("head")[0].appendChild(node);
   }

   ngOnInit() {
        this.loadAPI = new Promise(resolve => {
            console.log("resolving promise...");
            this.loadScript();
        });
   }

但这不起作用

1 个答案:

答案 0 :(得分:0)

您可以将它们添加到正文中。您的路径也应该在客户端可用。但是在Init事件中添加脚本是不好的做法-每次创建组件时都会添加脚本。我在服务中添加了脚本-它执行一次。

     const files = ['js/sip-0.5.0.js','js/ua.js']
     files.forEach((file) => {
                const fileRef = document.createElement('script');
                fileRef.setAttribute('type', 'text/javascript');
                fileRef.setAttribute('src',  file);
                fileRef.onload = function () {
                    console.log('loaded' + file);
                };
                document.body.appendChild(fileRef);
            });

但是这种方法仅适用于基于某些条件的动态添加脚本。如果您的脚本独立于其他文件,则可以将其添加到捆绑文件中,而无需进行任何手动操作。