我在Angular项目的styles.scss文件中添加了导入Google字体的链接。
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700');
它已经可以使用Angular CLI命令ng serve了，但是在开发之后，我使用命令ng build --prod --base-href构建项目。然后运行我的项目我发现了一个问题。
问题是，它不适用于导入谷歌字体。
我去谷歌研究这个问题。但我没有找到一个好的解决方案。
所以我需要知道如何在我的角度项目中应用谷歌字体，需要将其排序？
如果你想在你的角度应用程序中包含谷歌自己的Roboto字体版本
npm install roboto-fontface
然后在你的angular.json文件里面添加样式列表中的字体文件
"styles": [
"node_modules/roboto-fontface/css/roboto/roboto-fontface.css"
],
尝试这样的事情：
在index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet">
</head>
<body>
<app-root>
Loading...
</app-root>
</body>
</html>
这是在本地使用谷歌字体2,4,5,6,7和更多的最佳方式，首先下载谷歌字体，这在资产文件夹内，并根据您的要求使用它。
在angular.json中，在src / assets中调用它
"assets": [
"src/assets"
],
在css文件中将此font-face添加到顶部
@font-face {
font-family: 'Montserrat';
src: url(/assets/Montserrat/Montserrat-Light.ttf) format("truetype");
font-weight:300;
}
最后根据您的要求使用它
body{
font-family: 'Montserrat', sans-serif;
}