Link 到 Vue Cli 3 的字体

Question

我正在尝试 link 我的@font-face 到我的字体文件夹 (assets/fonts) 上由 vue cli 3 和 vue 2 创建的项目

arborescence

assets/sass/utilities/fonts.sass

@font-face
  font-family: 'NeuzeitGroteskBold'
  src: url($font-path + 'NeuzeitGroteskBold/neuzeitgro-bol-webfont.eot')
  src: url($font-path + 'NeuzeitGroteskBold/neuzeitgro-bol-webfont.eot?#iefix') format('embedded-opentype'),
       url($font-path + 'NeuzeitGroteskBold/neuzeitgro-bol-webfont.woff2') format('font-woff2'),
       url($font-path + 'NeuzeitGroteskBold/neuzeitgro-bol-webfont.woff') format('font-woff'),
       url($font-path + 'NeuzeitGroteskBold/neuzeitgro-bol-webfont.ttf') format('font-truetype')
  font-weight: normal
  font-style: normal

assets/sass/app.sass

@charset "utf-8"
$font-path: '~@/assets/fonts/'
@import 'utilities/all'

我已经尝试过 ../../fonts 或 assets/fonts，将其放入 public 文件夹或使用 font-url 但没有任何效果...

我没有收到任何错误消息，只是字体无法正常工作

Answer 1

好的，因为用于修复另一个错误的 format('font-woff') 不正确

正在与 format('woff')

合作

Link 到 Vue Cli 3 的字体

Link to fonts with Vue Cli 3

javascript

sass

vue.js

vue-cli-3