使用 SystemJS 导入 jquery 不起作用

Question

我不知道如何以在我的项目中工作的方式使用 SystemJS 导入 jQuery。 index.html:

...
<script>
  System.import('app').catch(function(err){ console.error(err); });
  System.import('jquery').catch(function(err){ console.error(err); });
  System.import('bootstrap').catch(function(err){ console.error(err); });
</script>
...

错误：

(index):26 错误：(SystemJS) Bootstrap 的 JavaScript 需要 jQuery 错误：Bootstrap 的 JavaScript 需要 jQuery 在评估

systemjs.config.js

(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',

      // angular bundles
      ...

      'jquery': "npm:jquery/dist/jquery.min.js",
      'bootstrap': "npm:bootstrap/dist/js/bootstrap.min.js",

      // other libraries
      'rxjs':                      'npm:rxjs'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js'
      },
      rxjs: {
        defaultExtension: 'js'
      }
    }
  });
})(this);

Answer 1

发生这种情况是因为 bootstrap 首先导入。

导入是异步的。一个可以先于另一个导入。强制排序：

System.import('jquery')
.then(function($) {
  System.import('bootstrap');
})
.catch(function(err){ console.error(err); });

使用 SystemJS 导入 jquery 不起作用

Import jquery with SystemJS doesn't work

javascript

jquery

systemjs