# Aurelia-cli beta 1 with bootstrap

**URL:** <https://discourse.aurelia.io/t/aurelia-cli-beta-1-with-bootstrap/2017>\
**Category:** Help Requests\
**Created:** [December 12, 2018, 7:32pm UTC](https://discourse.aurelia.io/t/aurelia-cli-beta-1-with-bootstrap/2017 "2018-12-12T19:32:46Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Tommy](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/tommy/32/1238_2.png) [@Tommy](https://discourse.aurelia.io/u/Tommy)\
**Post date:** [December 12, 2018, 7:32pm UTC](https://discourse.aurelia.io/t/aurelia-cli-beta-1-with-bootstrap/2017/1 "2018-12-12T19:32:46Z")

</div>

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!

---

<div class="post-metadata">

**Author:** ![huochunpeng](https://avatars.discourse-cdn.com/v4/letter/h/49beb7/32.png) [@huochunpeng](https://discourse.aurelia.io/u/huochunpeng)\
**Post date:** [December 13, 2018, 2:01am UTC](https://discourse.aurelia.io/t/aurelia-cli-beta-1-with-bootstrap/2017/2 "2018-12-13T02:01:05Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![Tommy](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/tommy/32/1238_2.png) [@Tommy](https://discourse.aurelia.io/u/Tommy)\
**Post date:** [December 16, 2018, 12:02pm UTC](https://discourse.aurelia.io/t/aurelia-cli-beta-1-with-bootstrap/2017/3 "2018-12-16T12:02:48Z")

</div>

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 🙂