php 我在哪里可以在 Laravel 5 中放置自定义字体?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/36966953/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Where do I place custom fonts in Laravel 5?
提问by user3818418
Complete beginner to Laravel 5 and trying to import custom fonts using this code in my header:
完整的 Laravel 5 初学者并尝试在我的标题中使用此代码导入自定义字体:
<style>
@font-face {
font-family: 'Conv_OptimusPrinceps';
src: url('fonts/OptimusPrinceps.eot');
src: local('?'), url('fonts/OptimusPrinceps.woff') format('woff'), url('fonts/OptimusPrinceps.ttf') format('truetype'), url('fonts/OptimusPrinceps.svg') format('svg');
font-weight: normal;
font-style: normal;
}
and calling it in my variables.scss. Currently my fonts are stored in my public directory:
并在我的 variables.scss 中调用它。目前我的字体存储在我的公共目录中:
public/fonts/OptimusPrinceps.woff
public/fonts/OptimusPrinceps.tff
etc.
For some reason this warning appears in my dev tools
出于某种原因,这个警告出现在我的开发工具中
Failed to decode downloaded font: http://localhost:3000/fonts/OptimusPrinceps.tff
OTS parsing error: invalid version tag
And my font doesn't load correctly.
而且我的字体加载不正确。
回答by Josh
Place anything that the client browser should access into /public/
. You can use the Laravel helper function public_path
to build full URLs for it.
https://laravel.com/docs/5.2/helpers#method-public-path
将客户端浏览器应访问的任何内容放入/public/
. 您可以使用 Laravel 辅助函数public_path
为其构建完整的 URL。
https://laravel.com/docs/5.2/helpers#method-public-path
For instance, if you put your font in /public/fonts/OptimusPrinceps.tff
(which you've done), you can access it one of two ways.
例如,如果您将字体放入/public/fonts/OptimusPrinceps.tff
(已完成),则可以通过以下两种方式之一访问它。
In Blade:
在刀片中:
<style type="text/css">
@font-face {
font-family: OptimusPrinceps;
src: url('{{ public_path('fonts/OptimusPrinceps.tff') }}');
}
</style>
In CSS includes:
在 CSS 中包括:
@font-face {
font-family: OptimusPrinceps;
src: url('/fonts/OptimusPrinceps.tff');
}
In the second example, you don't need any Laravel magic, really. Just reference the path absolutely so that it points to the correct directory.
在第二个例子中,你真的不需要任何 Laravel 魔法。只需绝对引用路径,使其指向正确的目录。
Worth noting that this works with Bootstrap and SCSS. I usually put fonts in /public/static/fonts/
.
值得注意的是,这适用于 Bootstrap 和 SCSS。我通常把字体放在/public/static/fonts/
.
回答by Adam Pery
In webpack.mix.js
add
在webpack.mix.js
加
mix.copyDirectory('resources/assets/fonts', 'public/fonts');
Full doc here: https://laravel.com/docs/5.5/mix
完整文档在这里:https: //laravel.com/docs/5.5/mix
回答by Allan Dereal
In Laravel 5.4 in CSS, i had to add the /public
before the /fonts
folder for it to work. (for css included in a file)
在 CSS 中的 Laravel 5.4 中,我必须/public
在/fonts
文件夹之前添加它才能工作。(对于包含在文件中的 css)
`@font-face {
font-family: OptimusPrinceps;
src: url('/public/fonts/OptimusPrinceps.tff');
}`
An alternative which is the best way would be to use the assets()
helper function as below. The fonts folder should be in the public directory for this case. (for css in the head tag)
另一种最好的方法是使用assets()
辅助函数,如下所示。在这种情况下,字体文件夹应位于公共目录中。(用于 head 标签中的 css)
`<style>
@font-face {
font-family: OptimusPrinceps;
src: url('{{asset('/fonts/OptimusPrinceps.tff')}}');
}
</style>`
回答by LetsCMS Pvt Ltd
To add the public keyword when you including the custom font in laravel please add following:
要在 Laravel 中包含自定义字体时添加 public 关键字,请添加以下内容:
supose font path is css/fonts/proxima-nova-light-59f99460e7b28.otf in public directory then use as
假设字体路径是公共目录中的 css/fonts/proxima-nova-light-59f99460e7b28.otf 然后用作
@font-face {
font-family: 'proxima-nova';
font-style: normal;
font-weight: 900;
src: url('../public/css/fonts/proxima-nova-light-59f99460e7b28.otf');
}
So you can use the ../public/+ font path in public directory. If you have any issue please tell me your font path I will update you path for that.
所以你可以使用public 目录中的../public/+ 字体路径。如果您有任何问题,请告诉我您的字体路径,我会为此更新您的路径。