在 Laravel 8 中导入自定义字体

Posted 2023-03-14

【中文标题】在 Laravel 8 中导入自定义字体

【英文标题】：Importing custom fonts in Laravel 8

【发布时间】：2021-10-23 09:36:39

【问题描述】：

我正在尝试使用 Laravel 8（混合）将自定义字体加载到我的项目中，但不知道我的流程有什么问题。每当我尝试将字体与我的 scss 一起使用时，字体似乎都不起作用。

这是我的目录树在 atm 中的样子：

我的公共目录

公开

资产 CSS js CSS app.css js app.js

我的资源目录

资源

字体 opensans.ttf 萨斯 app.scss

现在app.scss 包含以下内容

$font-path: "../fonts";
@font-face 
    src: url("#$font-path/OpenSans-Regular.ttf") format("ttf");
    font-family: "OpenSans";

我什至尝试将字体放在public 文件夹中，但它不起作用，我也尝试从谷歌字体导入字体，它也不起作用。

【问题讨论】：

您检查 Chrome 控制台是否有任何错误？您应该将字体放在public 目录中，例如public/fonts/opensans.ttf。

控制台没有错误。我也尝试过，但无法将字体加载到我的css。

然后这样做，尝试在sources选项卡中找到css文件，然后看看最终的URL是什么。另外，请注意您在使用OpenSans-Regular.ttf 时，您的fonts 文件夹中有opensans.ttf...

复制，抱歉还是个新手，但会尝试一下，谢谢 bud。

【参考方案1】：

您需要在laravel.mix.js到public/fonts中添加一个带有字体的规则复制文件夹

mix.copy('resources/fonts', 'public/fonts');