How to add nanito font to vue.js component?

Question

Vue.js

Good afternoon. It is necessary to change the font in several places to nanito. If I do something like this, it works

.custom-font {
  font-family: 'Arial', sans-serif !important;
}

But it doesn't work with nano. I'm trying to import it

@import url('https://fonts.googleapis.com/css?family=Nunito+Sans');

and then apply

.custom-font {
  font-family: 'Nunito Sans', sans-serif !important;
}

also doesn't work.
How to do it right?