我目前正在尝试优化我的网站并异步加载字体系列
起初这是一个材料图标的问题,如下图所示
通过在 index.html 中使用 webfontloader 摆脱了这个问题后,我现在遇到了这个错误,这并不容易摆脱
为了尝试解决它,我将指向<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.5.18/webfont.js"></script>
webfont.js 的 CDN 链接更改为在本地使用npm i webfontloader
和加载它,但问题仍然存在。如何让 webfont.js 不被渲染阻塞?
索引.html
<!doctype html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="utf-8">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta charset="UTF-8">
<title>My App</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="assets/logo.ico">
<script src="../node_modules/webfontloader/src/core/webfont.js"></script>
<script>
WebFont.load({
google: {
families: ['Material+Icons']
}
});
</script>
</head>
<body>
<app-root>
</app-root>
</body>
</html>