Question

我正在使用带有sass的css模块。所以我尝试像这样加载它们：

pnt_grp = re.match(re.escape(lattice_type) + '(.*?) .*', line, re.M|re.I)

The most interesting path is that they actually loaded by the browser.

所以内联CSS看起来像这样：

@font-face {
  font-family: 'Book Antiqua';
  src: url(@/assets/fonts/book_antiqua.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Montserrat';
  src: url(@/assets/fonts/Montserrat/Montserrat-Regular.ttf) format('truetype');
  font-weight: 400;
  font-style: normal;
}

但是它们不起作用（所以我一无所知。浏览器加载了字体，字体外观语法看起来还可以，但它们不会触发。

我的webpack配置的加载程序：

@font-face {
  font-family: 'Book Antiqua';
  src: url("http://localhost:8080/static/media/book_antiqua.d8ae129c.ttf") format("truetype");
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: 'Montserrat';
  src: url("http://localhost:8080/static/media/Montserrat-Regular.2bb14503.ttf") format("truetype");
  font-weight: 400;
  font-style: normal; }

Answer 1

我从不从资产中导入字体，我总是使用诸如Google字体之类的服务来获取我的资源，它们在那里有montserrat，我是这样导入的

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

但这只是一个创可贴，在另一个地方可能会发现一个问题是您在哪里使用该字体，如何将该字体添加到某个类中很重要，例如，对于蒙特塞拉特，您应该这样做

font-family: 'Montserrat', sans-serif;

由CSS模块加载时字体不起作用

1 个答案: