CODEWITHSUNDEEP
twitter-bootstrapangularng2-bootstrap
Hongbo Miao
Hongbo Miao

Reputation: 49724

How to switch from Bootstrap 3 to Bootstrap 4 with ng2-bootstrap?

I am using ng2-bootstrap for an Angular 2 project.

This package supports both Bootstrap 3 and 4. After I install it, it uses Bootstrap 3 by default. I didn't find any information about switching.

How can I switch from Bootstrap 3 to Bootstrap 4? Should I write something in the file tsconfig.json?

Thank you!

Upvotes: 3

Views: 1774

Answers (3)

ivan trujillo
ivan trujillo

Reputation: 399

Easy:

uninstall boostrap package npm uninstall --save bootstrap

install boostrap 4 package npm install --save [email protected]

As ng2-boostrap works with both packages, it simply detect the bootstrap package installed and that's all. It's working for me.

Upvotes: 1

Rein Baarsma
Rein Baarsma

Reputation: 1536

Actually Vamsi's answer isn't working for me in the current version. I looked through the source code and this does work:

Put this in the top of your <head> in the html:

<script type="text/javascript">
    // temporary hack for enable bootstrap 4
    window.__theme = 'bs4';
</script>

Upvotes: 4

Vamsi
Vamsi

Reputation: 9780

You have to set the theme to bootstrap4

import {Ng2BootstrapConfig, Ng2BootstrapTheme} from '../ng2-bootstrap';    

Ng2BootstrapConfig.theme = Ng2BootstrapTheme.BS4;

Note: The above code should be used before your main component. The same place where you will use angular2's enableProdMode();

Upvotes: 4

Related Questions