micromata/Baumeister

Update Bootstrap Version?

dertuerke opened this issue · 7 comments

Hi, how i can Update the Bootstrap Version to 4?

The following should be all you need.

1. Uninstall the Sass version of Boostrap 3.3.7:

npm uninstall -S bootstrap-sass

2. Install the latest beta version of Bootstrap 4 with the @next tag:

npm install -S bootstrap@next

3. Update the include of Bootstraps main Sass file

Replace:

@import "../../../node_modules/bootstrap-sass/assets/stylesheets/bootstrap";

With:

@import "../../../node_modules/bootstrap/scss/bootstrap";

4. Update the variables

Replace the 3.3.7 variables in:
https://github.com/micromata/Baumeister/blob/master/src/assets/scss/_variables.scss#L47-L920

with the ones provided by beta 2:
https://github.com/twbs/bootstrap/blob/v4.0.0-beta.2/scss/_variables.scss

5. Remove the icon font settings

Since Boostrap 4 doesn’t seem to ship an icon font you have to remove the following lines.

The icon font path variable in here:
https://github.com/micromata/Baumeister/blob/master/src/assets/scss/_variables.scss#L9

The setting for copying the icons font in here:
https://github.com/micromata/Baumeister/blob/master/baumeister.json#L10

6. Update import in JS entrypoint

Replace:

// Because of bootstrap is not an UMD Module, we can’t import it with ES6 syntax.
require('bootstrap-sass');

with:

import 'bootstrap';

We won’t include v4 until it ships the final 4.0.0 release btw.

DANKE SCHÖN!!!!! LUV

Sehr gerne 😊

Update. Added the following to the list:

3. Update the include of Bootstraps main Sass file

Update. Added the following to the list:

  1. Update import in JS entrypoint

Sadly it doesn’t work out of the box with out browserify setup. Tt’s throwing the follwing on the browser console:

Uncaught ReferenceError: $ is not defined

Guess its possible to fix with a shim.

But this won’t be a problem as soon as #211 is merged.

I hope the update comes out quickly