如何在javascript主文件中导入外部模块(async.js)

所以在工作中,我们买了一个主题,我必须自定义它并将其用于内部项目。他们使用pug从一些模板生成最终文件。当然,在.pug模板中,我可以插入一些外部javascript文件。

其中文件的空js示例如下所示:

(function(window, document, $) {
  'use strict';
   $(window).on('load', function () {

   })
})(window, document, jQuery);

(jQuery和bootstrap自动包含在模板中)。 我成功地创建了我的javascript文件,并仅使用纯js和一些jQuery(但是我有点错过了angularjs,但是我不能同时使用.pug和angular)来处理这个项目。

我到了必须向服务器发出多个GET请求的地步,我需要它们是异步的。在我以前的项目中,我成功地使用了异步模块,我也想在这里使用它。惊喜,惊喜,我不能导入模块。

我试着用一条简单的线 import * as async from '../libs/async/async.js'; 但如果我想使用一个简单的async.series,它会说: Uncaught TypeError: async.series is not a function . 我尽力了。从上面的错误到 "Unrecognized token *" . 是的,我将.js文件声明为 type="module" .

我试图自己模拟这个问题,并创建了以下文件结构(它类似于主题中的文件结构)。

  .
    ├── assets
    │   └── js
    │       ├── dashboards
    │       │   └── dash.js
    │       └── libs
    │           └── async.js
    └── src
        └── index.html

在.html文件中,我只包括jQuery和dash.js文件。dash.js文件包含以下代码:

'use strict';
import * as async from '../libs/async.js';

    $(window).on('load', function () {
        function init() {
            console.log("Hello there!");

            async.series([
                function(callback) { console.log(5); callback(); },
                function(callback) { console.log(6); callback(); }
            ]);
        }

        init();
    });

但是…又错了。

Uncaught ReferenceError: async is not defined
    at init (dash.js:8)

究竟如何导入异步模块(或任何其他模块)并正确使用它?

更新: 在.html文件中,如果包含

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

看起来很有效,但我真的想知道如果没有它,这是否可以做到。