Bootstrap modal error in sage 8.6

sage
,
1

Hello,

Trying to use modal in sage 8.6.0 without success.

I guess is because the order of the scripts are loaded, jquery should be loaded first than bootstrap.

Can I force that in the gulpfile, how can I achieve that?

Or there is a workaround for this situation?

thanks

2

In what way are you unsuccessfu? What doesn’t work? What does your code look like? What errors do you receive? What have you tried to fix it?

3

The modal dosn’t open, when i try to call it show the error:

VM7677:1 Uncaught TypeError: jQuery(…).modal is not a function

This is in a fresh install of sage, this is my bower.json:
{
“name”: “sage”,
“homepage”: “https://roots.io/sage/”,
“authors”: [
“Ben Word ben@benword.com”
],
“license”: “MIT”,
“private”: true,
“dependencies”: {
“bootstrap”: “^4.0.0”,
“owl.carousel”: “^2.3.4”
},
“overrides”: {
“bootstrap”: {
“main”: [
“./scss/bootstrap.scss”,
“./dist/js/bootstrap.bundle.js”
]
}
}
}

4

I would start by troubleshooting the actual error you’re getting before trying to mess with the order of things in Sage. Sage definitely works out if the box.

Some quick googling of your error suggests:

  1. make sure your code is included after the Sage bundle js
  2. make sure jquery isn’t being included twice
  3. check if other jquery functions work

Ultimately this is a JavaScript, Bootstrap, and jquery troubleshooting effort.

5

Ok, I think I see what the problem is.

When I install a package via bower, bower automatic adds jquery.

I will need fancibox and owl carousel, the prefered way is to add them by bower, right?

Is it possible to prevent theese packages to install jquery?

thanks