Search code examples
aureliajspmtwitter-bootstrap-4

JSPM / Aurelia / Bootstrap 4 can't find jQuery


So I have an aurelia setup using jspm. I have install Bootstrap 4 like so:

jspm install npm:[email protected]

Then in main.js I did:

import 'jquery';
import 'bootstrap';

export function configure(aurelia) {
  aurelia.use
    .standardConfiguration()
    .developmentLogging();

  //Uncomment the line below to enable animation.
  //aurelia.use.plugin('aurelia-animator-css');
  //if the css animator is enabled, add swap-order="after" to all router-view elements

  //Anyone wanting to use HTMLImports to load views, will need to install the following plugin.
  //aurelia.use.plugin('aurelia-html-import-template-loader')

  aurelia.start().then(() => aurelia.setRoot());
}

I even tried import $ from 'jquery' but when I spin up the aurelia skeleton with BS4 I get:

Uncaught Error: Bootstrap's JavaScript requires jQuery

I can go to the console and do $ and it returns the jquery stuff. I think it is a race condition but not sure how to fix?

EDIT: System.config

System.config({
  defaultJSExtensions: true,
  transpiler: "none",
  paths: {
    "*": "dist/*",
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },
  meta: {
    "bootstrap": {
      "deps": [
        "jquery"
      ]
    }
  },
  map: {

Solution

  • Use jspm install bootstrap=github:twbs/[email protected]

    There are problems installing bootstrap with jspm from npm: (see here).

    See this file for how to import it (from this project).

    Update: here is the Pull Request that should fix this.