search

aurelia / bundler

A library for bundling JavaScript, HTML and CSS for use with SystemJS.
MIT License
37 stars 25 forks source link

"Bootstrap's JavaScript requires jQuery" Error after bundling with minify = true #92

Closed BoeseB closed 8 years ago

BoeseB commented 8 years ago

Hi,

I got the following problem.

After bundling my application (almost the same as the "skeleton-typescript" project from the skeleton-navigation pack) i get the following Error when loading the page:

Error: Bootstrap's JavaScript requires jQuery
    Error loading file:///D:/Development/aurelia_test/dist/main.js
    at file:///D:/Development/aurelia_test/dist/aurelia-54e3bef5bc.js:3:22627
    at file:///D:/Development/aurelia_test/dist/aurelia-54e3bef5bc.js:4:27322
    at i (file:///D:/Development/aurelia_test/jspm_packages/system.js:4:31576)
    at s (file:///D:/Development/aurelia_test/jspm_packages/system.js:4:31192)
    at file:///D:/Development/aurelia_test/jspm_packages/system.js:4:31654
    at file:///D:/Development/aurelia_test/dist/aurelia-54e3bef5bc.js:4:27468
    at i (file:///D:/Development/aurelia_test/jspm_packages/system.js:4:31576)
    at i (file:///D:/Development/aurelia_test/jspm_packages/system.js:4:31538)
    at n (file:///D:/Development/aurelia_test/jspm_packages/system.js:4:30141)
    at Object.execute (file:///D:/Development/aurelia_test/jspm_packages/system.js:5:3176)

This does not happen if i set minify of the "dist/aurelia" bundle to false.

How can i get this to work with minifying the bundle?

EisenbergEffect commented 8 years ago

@ahmedshuhel Can you help out with this? I see things like this coming up fairly often. This might be an example that we need to add to the bunder documentation.

ahmedshuhel commented 8 years ago

@BoeseB Could you please post your config.js and bundle config? It would be even better If you can push the code to github and give us the link.

BoeseB commented 8 years ago

it's basicly the typescript-skeleton i didn't change the config.js or bundle config manually.

All i did was installing some packages like upgrading to typings from the tsd Type Definition Manager via npm.

Commands i used for the migration to typings

$ npm uninstall tsd
$ rm -rf typings
$ npm install typings
$ typings init --upgrade
$ rm tsd.json
$ typings install

It's up on github here should be unbundled in this version, I forgot to push the new changes and will be able to update on monday. Most of the new changes, if not all, are just in css and html files anyway

ahmedshuhel commented 8 years ago

I will take a look at it. Thanks.

crbranch commented 8 years ago

I'm seeing the same issue using the Typescript skeleton unmodified. It works correctly if I run it unbundled. However, after bundling, it complains that bootstrap cannot find jquery, but only when the bundle is minified. If I disable minification and rebundle, then it works. From what I can tell, jquery is present in the bundle in both cases.

If I then jspm install jquery and also add a "jquery" entry to the list of "includes" in build\bundles.js, that resolves the error in the browser (app appears to run properly), but upon closer inspection there are actually two copies of jquery in the final bundle. It looks like I'm getting two copies because one copy (from the original skeleton) is prefixed with github:, and the other (I installed via jspm) is prefixed with npm: Partial config.js below:

"aurelia-da066bf602.js": [
  "github:components/jquery@2.2.1.js",
  "github:components/jquery@2.2.1/jquery.js",
  .....
  "npm:jquery@2.2.1.js",
  "npm:jquery@2.2.1/dist/jquery.js"
crbranch commented 8 years ago

So, I dug into this a little by stepping through the SystemJS loader code to try to understand what is different about the minified vs. non-minified bundle. It turns out that the loader code uses some regex to identify the module type based on the contents of the bundle. (Look for amdRegEx, cjsRequireRegEx, cjsExportsRegEx, etc. in system.src.js). When the bundle is not minified, the loader identifies it as 'amd' format; but when the bundle is minified, the loader identifies it as 'cjs' format. I'm not an expert on module loaders/formats, but I think this is the issue (i.e., jQuery is not getting defined at global scope in the 'cjs' case, so bootstrap fails).

StrahilKazlachev commented 8 years ago

If the loader is guessing wrong, add a meta config.

davidbfrogman commented 8 years ago

can someone give an example of what the meta config should look like

davidbfrogman commented 8 years ago

@Driedas Solution for Bootstrap's JavaScript requires jQuery

"dist/bundle-aurelia": {
       "includes": [
        "aurelia-framework",
        "aurelia-bootstrapper",
        "aurelia-fetch-client",
        "aurelia-router",
        "aurelia-templating-binding",
        "aurelia-templating-resources",
        "aurelia-templating-router",
        "aurelia-loader-default",
        "aurelia-history-browser",
        "aurelia-logging-console",
        "jquery",
        "bootstrap",
        "bootstrap/css/bootstrap.css!text"
      ],

Adding jquery to the aurelia bundle seems to fix the problem. I also put 

import $ from 'jquery';

in my main.js Although I don't know if that actually helped or hurt. The problem only showed up when I deployed to heroku, and I couldn't get it to break locally when I bundled.

gp-slick-coder commented 8 years ago

@davidbfrogman tried both, but with no success.

davidbfrogman commented 8 years ago

Are you actually using bootatrap.js?

Not just the css?

If you're not actually using bootstrap.js remove the include line in main.js

istrau3 commented 8 years ago

+1 same issue.

I have tried many variants of this with no luck:

System.config({
          meta: {
            'github:components/jquery@2.2.1': {
              format: 'global',
              exports: 'jQuery', // the global property to take as the module value
            }
          }
        });
System.config({
          meta: {
            'jquery': {
              format: 'global',
              exports: 'jQuery', // the global property to take as the module value
            }
          }
        });

etc.

doktordirk commented 8 years ago

@ahmedshuhel i tried to get closer to the problem. gotta be a systemjs-builder bug. upgrading didn't help.

dunno if it helps, but the bug does depend on what's included in the bundle. eg: vanilla skeleton-es2016 has that problem add eg spoonx/aurelia-notification and, surprise, suddenly it works. repo: https://github.com/doktordirk/skeleton-navigation/commits/bundle-test

bsyk commented 8 years ago

I'm seeing the same issues with the skeleton-navigation pack. As a work-around, I've found pulling bootstrap into a separate bundle without minification then loads happily. By default is looks like bootstrap (js, not css) is only being used to handle the nav menu if the browser width is < 768 which may be why people are not seeing any problems. Here's what I've added to bundles.js:

"dist/boot": {
   "includes": [
      "bootstrap"
   ],
   "options": {
      "inject": true,
      "minify": false,
      "depCache": true,
      "rev": false
   }
}
zsvanderlaan commented 8 years ago

I also used the solution from @bsyk, but had to combine the suggestion of @davidbfrogman to include jquery. This is the working entry:

File: bundles.js

"dist/common/lib": {
      "includes": [
        "jquery",
        "bootstrap"
      ],
      "options": {
        "inject": true,
        "minify": false,
        "depCache": true,
        "rev": false
      }
    },

I also added jquery to my configuration:

File: config.js

map: {
    "aurelia-animator-css": "npm:aurelia-animator-css@1.0.0-beta.1.2.0",
    "aurelia-bootstrapper": "npm:aurelia-bootstrapper@1.0.0-beta.1.2.0",
    "aurelia-fetch-client": "npm:aurelia-fetch-client@1.0.0-beta.1.2.0",
    "aurelia-framework": "npm:aurelia-framework@1.0.0-beta.1.2.0",
    "aurelia-history-browser": "npm:aurelia-history-browser@1.0.0-beta.1.2.0",
    "aurelia-loader-default": "npm:aurelia-loader-default@1.0.0-beta.1.2.0",
    "aurelia-logging-console": "npm:aurelia-logging-console@1.0.0-beta.1.2.0",
    "aurelia-pal-browser": "npm:aurelia-pal-browser@1.0.0-beta.1.2.0",
    "aurelia-polyfills": "npm:aurelia-polyfills@1.0.0-beta.1.1.0",
    "aurelia-router": "npm:aurelia-router@1.0.0-beta.1.2.0",
    "aurelia-templating-binding": "npm:aurelia-templating-binding@1.0.0-beta.1.2.0",
    "aurelia-templating-resources": "npm:aurelia-templating-resources@1.0.0-beta.1.2.0",
    "aurelia-templating-router": "npm:aurelia-templating-router@1.0.0-beta.1.2.0",

    "jquery": "github:components/jquery@2.2.1",
    "bootstrap": "github:twbs/bootstrap@3.3.6",

    "fetch": "github:github/fetch@0.11.0",
    "font-awesome": "npm:font-awesome@4.5.0",
    "text": "github:systemjs/plugin-text@0.0.3",
    "github:twbs/bootstrap@3.3.6": {
      "jquery": "github:components/jquery@2.2.1"
    },
izderadicka commented 8 years ago

I can confirm that solution from @zsvanderlaan worked for me - and the only issue is about minification. Minify:false works, Minify:true does not.

config.js map gets updated automatically during gulp bundle - so the only action needed was separate bundle for boostrap and jquery

toxicehc commented 8 years ago

Greetings, I fortunately had a backup copy to consult and this is all I had to fix in my config.js file, to get it 'working' again:

"github:twbs/bootstrap@3.3.6": { "jquery": "npm:jquery@2.2.3"

It turned into this when I bundled: "jquery": "npm:jquery@3.0.0"

LivesleyWA commented 8 years ago

I encountered this as well. Finally sorted it.

Nothing directly to do with bundling. The module declaration created for bootstrap by jspm declares the dependency as JQuery V3. Bootstrap currently requires JQuery less than v3 - now would be 2.2.4. The error is not informative.

You can either edit your config.js file or, as I did, just load JQuery from a script tag and remove the JQuery entry from the config.js and bundle configuration files. Presumably this add a small overhead to loading a page but it's so small that I couldn't quantify it.

Presumably this will go away at some point when bootstrap begins to use the latest JQuery version.

atsu85 commented 8 years ago

@LivesleyWA, (If I understood the problem correctly) You could have 2 versions of jQuery if You use alias for at least one of them when installing jQuery through jspm. I guess then You don't need to manually edit config.js.

LivesleyWA commented 8 years ago

@atsu85 Haven't tried it and, for a number of reasons, I had to rewrite my current project to use JQuery instead. Useful to know though.

Presumably I would need to modify the jspm section in package.json so that JQuery references the correct version for bootstrap. I would also need to add an override to package.json so that bootstrap references the correct version of JQuery. The big problem right now is that the bootstrap entry generated by jspm references the wrong version of JQuery.

I have another project coming up and will give it a try.

vaskokj commented 8 years ago

So I think I'm running into this same issue.

caught (in promise) Error: Bootstrap's JavaScript requires jQuery Error loading http://localhost:8080/jspm_packages/github/twbs/bootstrap@3.3.6/js/bootstrap.js

I run "gulp export" and then move the "export" folder into my webserver and got this error.

I then did what the suggested solution here 

"dist/common/lib": {
  "includes": [
    "jquery",
    "bootstrap"
  ],
  "options": {
    "inject": true,
    "minify": false,
    "depCache": true,
    "rev": false
  }
},

Removed bootstrap and jquery from my bundles.js and export.js (except for "jspm_packages/github/twbs/bootstrap@3.3.6/fonts/*", and "styles/responsive.bootstrap.min.css", "styles/dataTables.bootstrap.min.css",) but keep getting the same error. What am I doing wrong to solve this issue?

LivesleyWA commented 8 years ago

For bootstrap v4, I added an explicit version of jquery as a project dependency in the jspm section of package.json. "jquery": "npm:jquery@2.2.4". This should ensure that the bundler is picking up the correct version of JQuery. I haven't tried bundling this yet but I suspect that it will work.

vaskokj commented 8 years ago

I tried that as well but it is still broken.

I did what LiveslyWA suggested and the other posts above but still get,

undefined:1 Uncaught (in promise) Error: Bootstrap's JavaScript requires jQuery Error loading http://localhost:8080/jspm_packages/github/twbs/bootstrap@3.3.6/js/bootstrap.js at http://localhost:8080/dist/aurelia.js:3:22533 at http://localhost:8080/dist/aurelia.js:4:27234 at i (http://localhost:8080/jspm_packages/system.js:4:31576) at n (http://localhost:8080/jspm_packages/system.js:4:30141) at Object.execute (http://localhost:8080/jspm_packages/system.js:5:3176) at y (http://localhost:8080/jspm_packages/system.js:4:9948) at w (http://localhost:8080/jspm_packages/system.js:4:10327) at p (http://localhost:8080/jspm_packages/system.js:4:8205) at h (http://localhost:8080/jspm_packages/system.js:4:8590) at http://localhost:8080/jspm_packages/system.js:4:6896

Here is my bundles.js

module.exports = {
  "bundles": {
    "dist/app-build": {
      "includes": [
        "[**/*.js]",
        "**/*.html!text",
        "**/*.css!text",
        "css",
        "datatables.net",
        "datatables.net-bs",
        "datatables.net-responsive",
        "datatables.net-responsive-bs",
        "text",
        "toastr"
      ],
      "options": {
        "inject": true,
        "minify": true,
        "depCache": true,
        "rev": false
      }
    },
    "dist/common/lib": {
      "includes": [
        "jquery",
        "bootstrap"
      ],
      "options": {
        "inject": true,
        "minify": false,
        "depCache": true,
        "rev": false
      }
    },
    "dist/aurelia": {
      "includes": [
        "aurelia-framework",
        "aurelia-bootstrapper",
        "aurelia-fetch-client",
        "aurelia-router",
        "aurelia-animator-css",
        "aurelia-templating-binding",
        "aurelia-polyfills",
        "aurelia-templating-resources",
        "aurelia-templating-router",
        "aurelia-loader-default",
        "aurelia-history-browser",
        "aurelia-logging-console",
        "bootstrap"
      ],
      "options": {
        "inject": true,
        "minify": true,
        "depCache": false,
        "rev": false
      }
    }
  }
};

export.js

module.exports = {
  "list": [
    "index.html",
    "config.js",
    "favicon.ico",
    "LICENSE",
    "jspm_packages/system.js",
    "jspm_packages/system-polyfills.js",
    "jspm_packages/system-csp-production.js",
    "styles/styles.css",
    "styles/responsive.bootstrap.min.css",
    "styles/dataTables.bootstrap.min.css",
    "jspm_packages/npm/font-awesome@4.6.1/css/font-awesome.min.css",
    "jspm_packages/npm/font-awesome@4.6.1/fonts/*",
    "jspm_packages/github/github/fetch@0.11.0.js",
    "jspm_packages/github/github/fetch@0.11.0/fetch.js",
    "jspm_packages/github/twbs/bootstrap@3.3.6/fonts/*",
    "jspm_packages/github/DataTables/Plugins@1.10.11/dataRender/ellipsis.js"
  ]
};

and config.js

System.config({
  defaultJSExtensions: true,
  transpiler: "babel",
  babelOptions: {
    "optional": [
      "runtime",
      "optimisation.modules.system"
    ]
  },
  paths: {
    "*": "dist/*",
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },
  map: {
    "DataTables/Plugins": "github:DataTables/Plugins@1.10.11",
    "aurelia-animator-css": "npm:aurelia-animator-css@1.0.0-beta.1.2.0",
    "aurelia-bootstrapper": "npm:aurelia-bootstrapper@1.0.0-beta.1.2.0",
    "aurelia-fetch-client": "npm:aurelia-fetch-client@1.0.0-beta.1.2.1",
    "aurelia-framework": "npm:aurelia-framework@1.0.0-beta.1.2.2",
    "aurelia-history-browser": "npm:aurelia-history-browser@1.0.0-beta.1.2.0",
    "aurelia-loader-default": "npm:aurelia-loader-default@1.0.0-beta.1.2.1",
    "aurelia-logging-console": "npm:aurelia-logging-console@1.0.0-beta.1.2.0",
    "aurelia-pal-browser": "npm:aurelia-pal-browser@1.0.0-beta.1.2.0",
    "aurelia-polyfills": "npm:aurelia-polyfills@1.0.0-beta.1.1.2",
    "aurelia-router": "npm:aurelia-router@1.0.0-beta.1.2.1",
    "aurelia-templating-binding": "npm:aurelia-templating-binding@1.0.0-beta.1.2.1",
    "aurelia-templating-resources": "npm:aurelia-templating-resources@1.0.0-beta.1.2.2",
    "aurelia-templating-router": "npm:aurelia-templating-router@1.0.0-beta.1.2.0",
    "babel": "npm:babel-core@5.8.38",
    "babel-runtime": "npm:babel-runtime@5.8.38",
    "bootstrap": "github:twbs/bootstrap@3.3.6",
    "core-js": "npm:core-js@1.2.6",
    "css": "github:systemjs/plugin-css@0.1.23",
    "datatables.net": "npm:datatables.net@1.10.12",
    "datatables.net-bs": "npm:datatables.net-bs@1.10.12",
    "datatables.net-responsive": "npm:datatables.net-responsive@2.1.0",
    "datatables.net-responsive-bs": "npm:datatables.net-responsive-bs@2.1.0",
    "fetch": "github:github/fetch@0.11.0",
    "font-awesome": "npm:font-awesome@4.6.1",
    "jquery": "npm:jquery@2.2.4",
    "text": "github:systemjs/plugin-text@0.0.3",
    "toastr": "npm:toastr@2.1.2",
    "github:jspm/nodelibs-assert@0.1.0": {
      "assert": "npm:assert@1.4.1"
    },
    "github:jspm/nodelibs-buffer@0.1.0": {
      "buffer": "npm:buffer@3.6.0"
    },
    "github:jspm/nodelibs-path@0.1.0": {
      "path-browserify": "npm:path-browserify@0.0.0"
    },
    "github:jspm/nodelibs-process@0.1.2": {
      "process": "npm:process@0.11.4"
    },
    "github:jspm/nodelibs-util@0.1.0": {
      "util": "npm:util@0.10.3"
    },
    "github:twbs/bootstrap@3.3.6": {
      "jquery": "npm:jquery@2.2.4"
    },
    "npm:assert@1.4.1": {
      "assert": "github:jspm/nodelibs-assert@0.1.0",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2",
      "util": "npm:util@0.10.3"
    },
    "npm:aurelia-animator-css@1.0.0-beta.1.2.0": {
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0",
      "aurelia-templating": "npm:aurelia-templating@1.0.0-beta.1.2.2"
    },
    "npm:aurelia-binding@1.0.0-beta.1.3.2": {
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0",
      "aurelia-task-queue": "npm:aurelia-task-queue@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-bootstrapper@1.0.0-beta.1.2.0": {
      "aurelia-event-aggregator": "npm:aurelia-event-aggregator@1.0.0-beta.1.2.0",
      "aurelia-framework": "npm:aurelia-framework@1.0.0-beta.1.2.2",
      "aurelia-history": "npm:aurelia-history@1.0.0-beta.1.2.0",
      "aurelia-history-browser": "npm:aurelia-history-browser@1.0.0-beta.1.2.0",
      "aurelia-loader-default": "npm:aurelia-loader-default@1.0.0-beta.1.2.1",
      "aurelia-logging-console": "npm:aurelia-logging-console@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0",
      "aurelia-pal-browser": "npm:aurelia-pal-browser@1.0.0-beta.1.2.0",
      "aurelia-polyfills": "npm:aurelia-polyfills@1.0.0-beta.1.1.2",
      "aurelia-router": "npm:aurelia-router@1.0.0-beta.1.2.1",
      "aurelia-templating": "npm:aurelia-templating@1.0.0-beta.1.2.2",
      "aurelia-templating-binding": "npm:aurelia-templating-binding@1.0.0-beta.1.2.1",
      "aurelia-templating-resources": "npm:aurelia-templating-resources@1.0.0-beta.1.2.2",
      "aurelia-templating-router": "npm:aurelia-templating-router@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0": {
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-event-aggregator@1.0.0-beta.1.2.0": {
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-framework@1.0.0-beta.1.2.2": {
      "aurelia-binding": "npm:aurelia-binding@1.0.0-beta.1.3.2",
      "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0",
      "aurelia-loader": "npm:aurelia-loader@1.0.0-beta.1.2.0",
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0",
      "aurelia-path": "npm:aurelia-path@1.0.0-beta.1.2.1",
      "aurelia-task-queue": "npm:aurelia-task-queue@1.0.0-beta.1.2.0",
      "aurelia-templating": "npm:aurelia-templating@1.0.0-beta.1.2.2"
    },
    "npm:aurelia-history-browser@1.0.0-beta.1.2.0": {
      "aurelia-history": "npm:aurelia-history@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-loader-default@1.0.0-beta.1.2.1": {
      "aurelia-loader": "npm:aurelia-loader@1.0.0-beta.1.2.0",
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-loader@1.0.0-beta.1.2.0": {
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-path": "npm:aurelia-path@1.0.0-beta.1.2.1"
    },
    "npm:aurelia-logging-console@1.0.0-beta.1.2.0": {
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-metadata@1.0.0-beta.1.2.0": {
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-pal-browser@1.0.0-beta.1.2.0": {
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-polyfills@1.0.0-beta.1.1.2": {
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-route-recognizer@1.0.0-beta.1.2.0": {
      "aurelia-path": "npm:aurelia-path@1.0.0-beta.1.2.1"
    },
    "npm:aurelia-router@1.0.0-beta.1.2.1": {
      "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0",
      "aurelia-event-aggregator": "npm:aurelia-event-aggregator@1.0.0-beta.1.2.0",
      "aurelia-history": "npm:aurelia-history@1.0.0-beta.1.2.0",
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-path": "npm:aurelia-path@1.0.0-beta.1.2.1",
      "aurelia-route-recognizer": "npm:aurelia-route-recognizer@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-task-queue@1.0.0-beta.1.2.0": {
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0"
    },
    "npm:aurelia-templating-binding@1.0.0-beta.1.2.1": {
      "aurelia-binding": "npm:aurelia-binding@1.0.0-beta.1.3.2",
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-templating": "npm:aurelia-templating@1.0.0-beta.1.2.2"
    },
    "npm:aurelia-templating-resources@1.0.0-beta.1.2.2": {
      "aurelia-binding": "npm:aurelia-binding@1.0.0-beta.1.3.2",
      "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0",
      "aurelia-loader": "npm:aurelia-loader@1.0.0-beta.1.2.0",
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0",
      "aurelia-path": "npm:aurelia-path@1.0.0-beta.1.2.1",
      "aurelia-task-queue": "npm:aurelia-task-queue@1.0.0-beta.1.2.0",
      "aurelia-templating": "npm:aurelia-templating@1.0.0-beta.1.2.2"
    },
    "npm:aurelia-templating-router@1.0.0-beta.1.2.0": {
      "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0",
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0",
      "aurelia-path": "npm:aurelia-path@1.0.0-beta.1.2.1",
      "aurelia-router": "npm:aurelia-router@1.0.0-beta.1.2.1",
      "aurelia-templating": "npm:aurelia-templating@1.0.0-beta.1.2.2"
    },
    "npm:aurelia-templating@1.0.0-beta.1.2.2": {
      "aurelia-binding": "npm:aurelia-binding@1.0.0-beta.1.3.2",
      "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0",
      "aurelia-loader": "npm:aurelia-loader@1.0.0-beta.1.2.0",
      "aurelia-logging": "npm:aurelia-logging@1.0.0-beta.1.2.0",
      "aurelia-metadata": "npm:aurelia-metadata@1.0.0-beta.1.2.0",
      "aurelia-pal": "npm:aurelia-pal@1.0.0-beta.1.2.0",
      "aurelia-path": "npm:aurelia-path@1.0.0-beta.1.2.1",
      "aurelia-task-queue": "npm:aurelia-task-queue@1.0.0-beta.1.2.0"
    },
    "npm:babel-runtime@5.8.38": {
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:buffer@3.6.0": {
      "base64-js": "npm:base64-js@0.0.8",
      "child_process": "github:jspm/nodelibs-child_process@0.1.0",
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "ieee754": "npm:ieee754@1.1.6",
      "isarray": "npm:isarray@1.0.0",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:core-js@1.2.6": {
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "path": "github:jspm/nodelibs-path@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2",
      "systemjs-json": "github:systemjs/plugin-json@0.1.1"
    },
    "npm:datatables.net-bs@1.10.12": {
      "datatables.net": "npm:datatables.net@1.10.12",
      "jquery": "npm:jquery@2.2.4"
    },
    "npm:datatables.net-responsive-bs@2.1.0": {
      "datatables.net-bs": "npm:datatables.net-bs@1.10.12",
      "datatables.net-responsive": "npm:datatables.net-responsive@2.1.0",
      "jquery": "npm:jquery@2.2.4"
    },
    "npm:datatables.net-responsive@2.1.0": {
      "datatables.net": "npm:datatables.net@1.10.12",
      "jquery": "npm:jquery@2.2.4",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:datatables.net@1.10.12": {
      "jquery": "npm:jquery@2.2.4",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:font-awesome@4.6.1": {
      "css": "github:systemjs/plugin-css@0.1.21"
    },
    "npm:inherits@2.0.1": {
      "util": "github:jspm/nodelibs-util@0.1.0"
    },
    "npm:path-browserify@0.0.0": {
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:process@0.11.4": {
      "assert": "github:jspm/nodelibs-assert@0.1.0"
    },
    "npm:toastr@2.1.2": {
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:util@0.10.3": {
      "inherits": "npm:inherits@2.0.1",
      "process": "github:jspm/nodelibs-process@0.1.2"
    }
  },
  depCache: {
    "github:twbs/bootstrap@3.3.6.js": [
      "github:twbs/bootstrap@3.3.6/js/bootstrap"
    ],
    "github:twbs/bootstrap@3.3.6/js/bootstrap.js": [
      "jquery"
    ],
    "npm:jquery@2.2.4.js": [
      "npm:jquery@2.2.4/dist/jquery"
    ],
    "npm:toastr@2.1.2.js": [
      "npm:toastr@2.1.2/toastr"
    ],
    "npm:toastr@2.1.2/toastr.js": [
      "jquery"
    ],
    "github:systemjs/plugin-text@0.0.3.js": [
      "github:systemjs/plugin-text@0.0.3/text"
    ],
    "npm:datatables.net-responsive-bs@2.1.0.js": [
      "npm:datatables.net-responsive-bs@2.1.0/js/responsive.bootstrap"
    ],
    "npm:datatables.net-responsive-bs@2.1.0/js/responsive.bootstrap.js": [
      "datatables.net-bs",
      "datatables.net-responsive"
    ],
    "npm:datatables.net-bs@1.10.12.js": [
      "npm:datatables.net-bs@1.10.12/js/dataTables.bootstrap"
    ],
    "npm:datatables.net-responsive@2.1.0.js": [
      "npm:datatables.net-responsive@2.1.0/js/dataTables.responsive"
    ],
    "npm:datatables.net-bs@1.10.12/js/dataTables.bootstrap.js": [
      "datatables.net"
    ],
    "npm:datatables.net-responsive@2.1.0/js/dataTables.responsive.js": [
      "datatables.net",
      "process"
    ],
    "npm:datatables.net@1.10.12.js": [
      "npm:datatables.net@1.10.12/js/jquery.dataTables"
    ],
    "github:jspm/nodelibs-process@0.1.2.js": [
      "github:jspm/nodelibs-process@0.1.2/index"
    ],
    "npm:datatables.net@1.10.12/js/jquery.dataTables.js": [
      "jquery",
      "process"
    ],
    "github:jspm/nodelibs-process@0.1.2/index.js": [
      "process"
    ],
    "npm:process@0.11.4.js": [
      "npm:process@0.11.4/browser"
    ],
    "github:systemjs/plugin-css@0.1.23.js": [
      "github:systemjs/plugin-css@0.1.23/css"
    ],
    "blur-image.js": [
      "aurelia-framework"
    ],
    "main.js": [
      "bootstrap"
    ],
    "pages/certificationsearch/datatable.js": [
      "aurelia-framework",
      "jquery",
      "datatables.net"
    ],
    "pages/certificationsearch/index.js": [
      "aurelia-framework",
      "aurelia-fetch-client",
      "fetch",
      "jquery",
      "toastr",
      "toastr/build/toastr.min.css!",
      "datatables.net-responsive",
      "datatables.net-responsive-bs",
      "datatables.net-bs"
    ],
    "users.js": [
      "aurelia-framework",
      "aurelia-fetch-client",
      "fetch"
    ]
  },
  bundles: {
    "common/lib.js": [
      "github:twbs/bootstrap@3.3.6.js",
      "github:twbs/bootstrap@3.3.6/js/bootstrap.js",
      "npm:jquery@2.2.4.js",
      "npm:jquery@2.2.4/dist/jquery.js"
    ],
    "aurelia.js": [
      "github:twbs/bootstrap@3.3.6.js",
      "github:twbs/bootstrap@3.3.6/js/bootstrap.js",
      "npm:aurelia-animator-css@1.0.0-beta.1.2.0.js",
      "npm:aurelia-animator-css@1.0.0-beta.1.2.0/aurelia-animator-css.js",
      "npm:aurelia-binding@1.0.0-beta.1.3.2.js",
      "npm:aurelia-binding@1.0.0-beta.1.3.2/aurelia-binding.js",
      "npm:aurelia-bootstrapper@1.0.0-beta.1.2.0.js",
      "npm:aurelia-bootstrapper@1.0.0-beta.1.2.0/aurelia-bootstrapper.js",
      "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0.js",
      "npm:aurelia-dependency-injection@1.0.0-beta.1.2.0/aurelia-dependency-injection.js",
      "npm:aurelia-event-aggregator@1.0.0-beta.1.2.0.js",
      "npm:aurelia-event-aggregator@1.0.0-beta.1.2.0/aurelia-event-aggregator.js",
      "npm:aurelia-fetch-client@1.0.0-beta.1.2.1.js",
      "npm:aurelia-fetch-client@1.0.0-beta.1.2.1/aurelia-fetch-client.js",
      "npm:aurelia-framework@1.0.0-beta.1.2.2.js",
      "npm:aurelia-framework@1.0.0-beta.1.2.2/aurelia-framework.js",
      "npm:aurelia-history-browser@1.0.0-beta.1.2.0.js",
      "npm:aurelia-history-browser@1.0.0-beta.1.2.0/aurelia-history-browser.js",
      "npm:aurelia-history@1.0.0-beta.1.2.0.js",
      "npm:aurelia-history@1.0.0-beta.1.2.0/aurelia-history.js",
      "npm:aurelia-loader-default@1.0.0-beta.1.2.1.js",
      "npm:aurelia-loader-default@1.0.0-beta.1.2.1/aurelia-loader-default.js",
      "npm:aurelia-loader@1.0.0-beta.1.2.0.js",
      "npm:aurelia-loader@1.0.0-beta.1.2.0/aurelia-loader.js",
      "npm:aurelia-logging-console@1.0.0-beta.1.2.0.js",
      "npm:aurelia-logging-console@1.0.0-beta.1.2.0/aurelia-logging-console.js",
      "npm:aurelia-logging@1.0.0-beta.1.2.0.js",
      "npm:aurelia-logging@1.0.0-beta.1.2.0/aurelia-logging.js",
      "npm:aurelia-metadata@1.0.0-beta.1.2.0.js",
      "npm:aurelia-metadata@1.0.0-beta.1.2.0/aurelia-metadata.js",
      "npm:aurelia-pal-browser@1.0.0-beta.1.2.0.js",
      "npm:aurelia-pal-browser@1.0.0-beta.1.2.0/aurelia-pal-browser.js",
      "npm:aurelia-pal@1.0.0-beta.1.2.0.js",
      "npm:aurelia-pal@1.0.0-beta.1.2.0/aurelia-pal.js",
      "npm:aurelia-path@1.0.0-beta.1.2.1.js",
      "npm:aurelia-path@1.0.0-beta.1.2.1/aurelia-path.js",
      "npm:aurelia-polyfills@1.0.0-beta.1.1.2.js",
      "npm:aurelia-polyfills@1.0.0-beta.1.1.2/aurelia-polyfills.js",
      "npm:aurelia-route-recognizer@1.0.0-beta.1.2.0.js",
      "npm:aurelia-route-recognizer@1.0.0-beta.1.2.0/aurelia-route-recognizer.js",
      "npm:aurelia-router@1.0.0-beta.1.2.1.js",
      "npm:aurelia-router@1.0.0-beta.1.2.1/aurelia-router.js",
      "npm:aurelia-task-queue@1.0.0-beta.1.2.0.js",
      "npm:aurelia-task-queue@1.0.0-beta.1.2.0/aurelia-task-queue.js",
      "npm:aurelia-templating-binding@1.0.0-beta.1.2.1.js",
      "npm:aurelia-templating-binding@1.0.0-beta.1.2.1/aurelia-templating-binding.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/abstract-repeater.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/analyze-view-factory.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/array-repeat-strategy.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/aurelia-templating-resources.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/binding-mode-behaviors.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/binding-signaler.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/compile-spy.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/compose.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/css-resource.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/debounce-binding-behavior.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/dynamic-element.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/focus.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/hide.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/html-resource-plugin.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/html-sanitizer.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/if.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/map-repeat-strategy.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/null-repeat-strategy.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/number-repeat-strategy.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/repeat-strategy-locator.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/repeat-utilities.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/repeat.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/replaceable.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/sanitize-html.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/set-repeat-strategy.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/show.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/signal-binding-behavior.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/throttle-binding-behavior.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/update-trigger-binding-behavior.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/view-spy.js",
      "npm:aurelia-templating-resources@1.0.0-beta.1.2.2/with.js",
      "npm:aurelia-templating-router@1.0.0-beta.1.2.0.js",
      "npm:aurelia-templating-router@1.0.0-beta.1.2.0/aurelia-templating-router.js",
      "npm:aurelia-templating-router@1.0.0-beta.1.2.0/route-href.js",
      "npm:aurelia-templating-router@1.0.0-beta.1.2.0/route-loader.js",
      "npm:aurelia-templating-router@1.0.0-beta.1.2.0/router-view.js",
      "npm:aurelia-templating@1.0.0-beta.1.2.2.js",
      "npm:aurelia-templating@1.0.0-beta.1.2.2/aurelia-templating.js",
      "npm:jquery@2.2.4.js",
      "npm:jquery@2.2.4/dist/jquery.js"
    ],
    "app-build.js": [
      "app.html!github:systemjs/plugin-text@0.0.3.js",
      "app.js",
      "blur-image.js",
      "child-router.html!github:systemjs/plugin-text@0.0.3.js",
      "child-router.js",
      "github:jspm/nodelibs-process@0.1.2.js",
      "github:jspm/nodelibs-process@0.1.2/index.js",
      "github:systemjs/plugin-css@0.1.23.js",
      "github:systemjs/plugin-css@0.1.23/css.js",
      "github:systemjs/plugin-text@0.0.3.js",
      "github:systemjs/plugin-text@0.0.3/text.js",
      "main.js",
      "nav-bar.html!github:systemjs/plugin-text@0.0.3.js",
      "npm:datatables.net-bs@1.10.12.js",
      "npm:datatables.net-bs@1.10.12/js/dataTables.bootstrap.js",
      "npm:datatables.net-responsive-bs@2.1.0.js",
      "npm:datatables.net-responsive-bs@2.1.0/js/responsive.bootstrap.js",
      "npm:datatables.net-responsive@2.1.0.js",
      "npm:datatables.net-responsive@2.1.0/js/dataTables.responsive.js",
      "npm:datatables.net@1.10.12.js",
      "npm:datatables.net@1.10.12/js/jquery.dataTables.js",
      "npm:jquery@2.2.4.js",
      "npm:jquery@2.2.4/dist/jquery.js",
      "npm:process@0.11.4.js",
      "npm:process@0.11.4/browser.js",
      "npm:toastr@2.1.2.js",
      "npm:toastr@2.1.2/toastr.js",
      "pages/certificationsearch/datatable.html!github:systemjs/plugin-text@0.0.3.js",
      "pages/certificationsearch/datatable.js",
      "pages/certificationsearch/index.html!github:systemjs/plugin-text@0.0.3.js",
      "pages/certificationsearch/index.js",
      "pages/certificationsearch/test.html!github:systemjs/plugin-text@0.0.3.js",
      "pages/certificationsearch/test.js",
      "users.html!github:systemjs/plugin-text@0.0.3.js",
      "users.js",
      "welcome.html!github:systemjs/plugin-text@0.0.3.js",
      "welcome.js"
    ]
  }
});
ppoulard commented 8 years ago

Same issue on Aurelia 1.0. To fix it, I did the following changes in aurelia.json :

"prepend": [
          "node_modules/bluebird/js/browser/bluebird.core.js",
          "scripts/require.js",
          "node_modules/jquery/dist/jquery.min.js"
        ],

and removes "jquery" in the "dependencies" section

Hope this helps !

ERobishaw commented 8 years ago

My woes began after npm installing jquery and nprogress.

I solved this by creating a separate jquery dependency, at the top of the list of dependencies and modified the bootstrap dep as well. aurelia.json

"dependencies": [
          {
            "name":"jquery",
            "path":"../node_modules/jquery/dist",
            "main":"jquery.min",
            "export": "$"
          },
          "aurelia-binding",
          "aurelia-bootstrapper",
          ...
          {
            "name": "bootstrap",
            "path": "../node_modules/bootstrap/dist",
            "main": "js/bootstrap.min",
            "resources": [
              "css/bootstrap.css"
            ]
          },
          ....
brendonco commented 8 years ago

@ERobishaw Your solution work for loading JQuery dependency for bootstrap. @EisenbergEffect Need to update the document in http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/the-aurelia-cli/6 under Legacy Library. Otherwise someone might encounter the same problem.

Below configuration doesnt seem to work when loading bootstrap. By separating the JQuery as a dependency seems to work.

Not working:

"dependencies": [
  "jquery",
  {
    "name": "bootstrap",
    "path": "../node_modules/bootstrap/dist",
    "main": "js/bootstrap.min",
    "deps": ["jquery"],
    "exports": "$"
  }
]

Working:

"dependencies": [
{
            "name":"jquery",
            "path":"../node_modules/jquery/dist",
            "main":"jquery.min",
            "export": "$"
          },
          {
            "name": "bootstrap",
            "path": "../node_modules/bootstrap/dist",
            "main": "js/bootstrap.min",
            "deps": ["jquery"],
            "resources": [
              "css/bootstrap.css"
            ]
          }
.....
EisenbergEffect commented 8 years ago

Would you be interested in submitting a PR?

snapjosh commented 7 years ago

This may or may not sound weird, but based on my experience, jquery needs to be added several (I haven't experimented with numbers) dependencies before bootstrap in aurelia.json in order to not pitch the "bootstrap's javascript requires..." error. I had jquery listed immediately before bootstrap in the dependencies and would occasionally get the error (which seemed like async or something). So I put jquery as my first dependency and bam, problem solved. Hope this helps.

amartens181 commented 7 years ago

Used au install jquery. Had to change aurelia.json to 

          {
            "name":"jquery",
            "path":"../node_modules/jquery/dist",
            "main":"jquery.min",
            "export": "$"
          },