JavaScript ES^ import order

Question

我有一个main.js文件，我在其中导入所有其他js文件，但问题是导入文件中的脚本没有按照导入的顺序执行。

我的主.js看起来像这样：

     import * as libs from './libs.js';
     import * as utils from './utils.js';
     import * as slider from './slider.js';

但是在主.js中，编译后，滑块脚本在 utils 之前运行，因此 util 在滑块中不可用.js

有没有办法设置导入文件的顺序？

我的文件内容是：

Utils.js：

         let Utils = Utils || {};
         (function($, window, document, app, undefined) {
         'use strict';
         app.isRwdSize = (size) => {
            return size.css('opacity') === 1;
          }
         })(jQuery, window, document, Utils);

滑块.js：

          import * as utils from './utils.js';
           let Utils= Utils|| {};
           (function($, window, document, app, undefined) {
               'use strict';
                console.log(app); - shows empty object
           })(jQuery, window, document, Utils);

主.js：

       import * as libs from './libs.js';
       //import * as utils from './utils.js'; - tried here and in slider.js
       import * as slider from './slider.js';

提前感谢您的任何帮助英国皇家空军

Answer 1

您的

let Utils = Utils || {};

行在模块化 JS 世界中没有意义。 Utils应该是已导入的模块化。同样，(function($, window, document, app, undefined) {作为包装器也不是您通常在模块中看到的。我希望你的文件是沿着

utils.js：

export const isRwdSize = (size) => {
  return size.css('opacity') === 1;
};

滑块.js：

import * as Utils from './utils.js';
console.log(Utils);

主.js：

import * as libs from './libs.js';
import * as slider from './slider.js';