Bxslider css & js not beeing added to /dist. [ Solved ]

sage
1

Hello,

This is the first time I’m using Sage so bear with me here!
I’m trying to add the "bxslider-4 " as a dependency through bower, the images files are correctly placed in the /dist folder but the css and js does not follow. Everything is correctly defined in the bxslider bower file aswell.

This is what my bowerfile looks like currently:

{
  "name": "sage",
  "homepage": "https://roots.io/sage/",
  "authors": [
    "Ben Word <ben@benword.com>"
  ],
  "license": "MIT",
  "private": true,
  "dependencies": {
    "bootstrap-sass": "3.3.6",
    "bxslider-4": "~4.2.5"
  },
  "overrides": {

    "bootstrap-sass": {
      "main": [
        "./assets/stylesheets/_bootstrap.scss",
        "./assets/javascripts/bootstrap/transition.js",
        "./assets/javascripts/bootstrap/alert.js",
        "./assets/javascripts/bootstrap/button.js",
        "./assets/javascripts/bootstrap/carousel.js",
        "./assets/javascripts/bootstrap/collapse.js",
        "./assets/javascripts/bootstrap/dropdown.js",
        "./assets/javascripts/bootstrap/modal.js",
        "./assets/javascripts/bootstrap/tooltip.js",
        "./assets/javascripts/bootstrap/popover.js",
        "./assets/javascripts/bootstrap/scrollspy.js",
        "./assets/javascripts/bootstrap/tab.js",
        "./assets/javascripts/bootstrap/affix.js",
        "./assets/javascripts/bootstrap/affix.js",
        "./assets/fonts/bootstrap/glyphicons-halflings-regular.eot",
        "./assets/fonts/bootstrap/glyphicons-halflings-regular.svg",
        "./assets/fonts/bootstrap/glyphicons-halflings-regular.ttf",
        "./assets/fonts/bootstrap/glyphicons-halflings-regular.woff",
        "./assets/fonts/bootstrap/glyphicons-halflings-regular.woff2"
      ]
    }
  }
}
2

Did you run gulp after installing it with bower?

3

Yes, the scripts shows up in the dist folder now ( just randomly worked at some point ). They are not added to the theme automatically though , i also tried setting main: true in manifest.json.

4

You shouldn’t have to add or edit anything in your manifest if you just want your plugin files to compile to your main.css and main.js? If you’re really sure the main declaration in the plugin’s bower.json is correct, it should work after running gulp.

5

Managed to figure it out, took way too long… :stuck_out_tongue:
Appriciate the help!

6

:cop: :oncoming_police_car: internet police, it’s a lot more helpful if you explain what you did to fix the issue, in case someone else sees the thread with the same issue.

3 Likes
7

The issue was in the manifest.json file:

I thought the name of the json key didnt matter so i just called it ‘bxslider’. It turns out it needs the .css / .js . It gives no warnings if you dont! :open_mouth:

Wrong:

  "bxslider": {
      
        "bower": ["bxslider-4"],

    },

Correct:

  "bxslider.css": {
      
        "bower": ["bxslider-4"],

    },
2 Likes