Aurelia-cli beta 1 with bootstrap


#1

I’m getting to know bootstrap and tried to set up a new project with the new Aurelia-cli beta, version 1.0.0-beta.7. I’m able to set up my project with the au-new command and I’m able to see the hello world page. Everything ok that far.

But when I tried to install bootstrap I’m unable to get this to work. I took a look at the contact tutorial but it doesnt look like that is updated with the new aurelia-cli. What do I have to do to get bootstrap to work with my project?

I’m using webpack. My main.js starts with:
import ‘bootstrap/dist/css/bootstrap.css’;

In my app.html I have:
require from=“bootstrap/css/bootstrap.css”

When i try to do au build I get the following error:
Module not found: Error: Can’t resolve ‘bootstrap/css/bootstrap.css’ in ‘C:\git\myproject\src’
This error is correct since this file doesn’t exist. But what do I have to do to get this to work?

Thanks!


#2

You only need one of the css import.

Try either removing the css from app.html,
Or removing the css from main.js, then modify the one in app.html to <require from="bootstrap/dist/css/bootstrap.css">, (I am not webpack user, not 100% sure, it probably need the “dist” part in the path).

BTW, you need import 'bootstrap'; in main.js to bring up bootstrap JavaScript features.

One more thing, when you do npm install bootstrap, it doesn’t install peer dependencies. You would need npm install jquery popper.js to satisfy bootstrap JavaScript features.


#3

Thanks for your reply. Site is working fine now, biggest problem was that I was trying to use bootstrap 3 menu in a bootstrap 4 environment :slight_smile: