In my aurelia.json file, I have the following configuration for bundling vendor scripts. It was directly copied from a working reference implementation and has been functioning properly.
{
'build': {
'bundles': [
'name': 'vendor-bundle.js'
'dependencies': [
"jquery",
{
"name": "bootstrap",
"path": "../node_modules/bootstrap/dist",
"main": "js/bootstrap.min",
"deps": ["jquery"],
"exports": "$",
"resources": [
"css/bootstrap.css"
]
}
]
]
}
}
However, when attempting to upgrade to Bootstrap 4, I encountered issues. I tried updating the path in
build.bundles.dependencies[].path../jspm_packages/github/twbs/bootstrap@4.0.0-alpha6../node_modules/bootstrap-v4-dev/distThe build process is successful; however, the issue appears during run-time:
DEBUG [templating] importing resources for app.html
Uncaught TypeError: plugin.load is not a function
Unhandled rejection Error: Failed loading required CSS file: bootstrap/css/bootstrap.css
UPDATE:
Following Ashley Grant's suggestion, I updated Bootstrap via NPM without making changes to aurelia.json. The error persisted, suggesting a bug. However, others have successfully migrated with the same toolchain.
UPDATE 2:
I have outlined steps to recreate the issue:
$ au new
name # any valid value
2 # Select TypeScript as the language
1 # Create project structure
1 # Install dependencies
Navigate to the project directory.
Add the specified entries to build.bundles[1].dependencies in aurelia_project/aurelia.json
$ npm install jquery --save
$ npm install bootstrap@^4.0.0-beta --save
Update src/app.html to include:
<template>
<require from="bootstrap/css/bootstrap.css"></require>
</template>
Finally, run either of the following commands and access the URL provided:
$ au run
OR
$ au build
$ serve
The described errors are observed in Google Chrome and Mozilla Firefox on Arch Linux systems. Testing on other systems has not yet occurred.
UPDATE 3:
Following @vidriduch's advice, everything seems to be functional. Still, the console displays:
Uncaught SyntaxError: Unexpected token export
vendor-bundle.js:3927 Uncaught Error: Mismatched anonymous define() module: [entirety of vendor-bundle.js printed here]
These messages appear initially upon page load in debug mode, but no further errors surface.