如何在 JavaScript 中导入它？

Question

I have a JavaScript function that runs in an HTML file, but in order to avoid "angular is not defined", I put the following before my HTML script

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js">

Is there a way to do this in a actual JavaScript file? I want to write my function in a JavaScript file not HTML so I can't use src HTML code.

I tried copying all the code and putting it in a file and referencing the file in the JavaScript but it doesn't work.

Any workarounds?

Answer 1

Something like:

    const libname = require("https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js") 

Should import the.js file into your project.

Answer 2

There are a variety of solutions to this problem and you should review how scripts load and the onready events for an html document. One simple solution would be coding your custom function to be called in an approach something like this:

<script onload="myCustomFunction();"
        src ="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js" >
</script>`

Of course, there are really many different approaches and I would consider this one only to use in a quick and dirty situation.

Answer 3

A simple technique that I use to load dependencies is to dynamically append them to the document head and use a load EventListener to run my code after the external script has finished loading.

let s = document.createElement('script');
s.src = 'https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js';
s.addEventListener('load', init);
document.head.appendChild(s);

function init() {
  // your code here
}

Source: I build a lot of plugins/widgets.