Correct way of Enqueue self hosted fonts in sass project

I think the better way would be declaring a file named _fontface.scss and put the below code blocks there –

@mixin fontFace($family,$src,$style: normal,$weight: normal) {
    @font-face {
        font-family: $family;
        src: url('#{$src}.eot'); // IE9 compat
        src: url('#{$src}.eot?#iefix') format('embedded-opentype'), // IE8 and below
            url('#{$src}.woff') format('woff'), // standards
            url('#{$src}.ttf') format('truetype'), // Safari, Android, iOS
            url('#{$src}.svg##{$family}') format('svg'); // legacy iOS

        font-style: $style;
        font-weight: $weight;
    }
}

Now you include that _fontface.scss to main bootstrap file and use it like-

@import 'fontface';
@include fontFace('YourFont','font/yourfont');

Hope that helps.