Bootstrap: No mixin named font-size

[EddyVinck]

I'm getting an error that says I'm missing a mixin, however I just installed version 4.3.0

h1, .h1 { @include font-size($h1-font-size); }
                      ^
          No mixin named font-size
          in node_modules/bootstrap/scss/_type.scss (line 16, column 20)

I'm on Ubuntu using Webpack 4.8.3 and Yarn.

I also checked the source and it is indeed using a font-size mixin

h1, .h1 { @include font-size($h1-font-size); }
h2, .h2 { @include font-size($h2-font-size); }
h3, .h3 { @include font-size($h3-font-size); }
h4, .h4 { @include font-size($h4-font-size); }
h5, .h5 { @include font-size($h5-font-size); }
h6, .h6 { @include font-size($h6-font-size); }

[lucagouty]

Hi @EddyVinck, I think it's because of new rfs feature.

I'm guessing you're importing mixins manually, but now there's an additional import :
https://github.com/twbs/bootstrap/blob/1ded0d6a4eefb7daca62c44e4e735aec200f0b6f/scss/_mixins.scss#L5-L6

And this vendor/_rfs.scss is defining the font-size mixin now

[MartijnCuppens]

Thanks for replying @lucagouty, this is indeed the cause. @EddyVinck could you check with the solution provided by Luca?

[EddyVinck]

Yes, that's it! Thanks! After adding that import I also got the error for the deprecate mixin, so this is what I had to do to fix all my errors:

// Vendor
@import "~bootstrap/scss/vendor/rfs";

// Deprecate
@import "~bootstrap/scss/mixins/deprecate";

Unrelated, but VSCode (insiders build) also wasn't being helpful. I tried searching my node_modules/bootstrap folder for "@mixin font-size" and nothing came up, even though the mixin is declared in node_modules/bootstrap/scss/vendor/_rfs.scss on line 198.

VSCode info
Version: 1.32.0-insider
Commit: 709bf352b12de8284683bef94cb5984129bfc776
Date: 2019-02-08T14:50:08.266Z
Electron: 3.1.3
Chrome: 66.0.3359.181
Node.js: 10.2.0
V8: 6.6.346.32
OS: Linux x64 4.15.0-45-generic

[MartijnCuppens]

@EddyVinck, you could also just include this file which includes all mixins Bootstrap uses:

@import "~bootstrap/scss/mixins";

Anyway, I'm going to close this since your problem seems to be solved now.

[arajay]

i would expect something like this to be in a migration guide but i couldn't find one