In this article, we’ll look at how to add a Google Font to a Vue.js Component.
To add a Google Font to a Vue.js Component, we use the @import directive.
For instance, we write
<style>
@import url("https://fonts.googleapis.com/css?family=Roboto+Condensed");
html,
body {
font-family: "Roboto", sans-serif;
}
#app {
font-family: "Roboto", sans-serif;
}
</style> to import the Roboto Google font with @import. Then we can set font-family to that to use it. To add a Google Font to a Vue.js Component, we use the @import directive.