0

我目前正在尝试优化我的网站并异步加载字体系列

起初这是一个材料图标的问题,如下图所示

在此处输入图像描述

通过在 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>

4

0 回答 0