Laravel Mix 生成字体到另一个目录
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/50860679/
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
Laravel Mix generate fonts into another directory
提问by Ven Nilson
I'm using laravel-mixwhich is built on the top of the webpack. I'm facing a problem with fonts directory. For Example, font-awesomepackage has a scss file and a font directory where all fonts are placed.
我正在使用laravel-mix构建在webpack. 我遇到了字体目录的问题。例如，font-awesome包有一个 scss 文件和一个放置所有字体的字体目录。
font-awesome:.
├───scss
│ fontawesome.scss
└───webfonts
fa-regular-400.eot
fa-regular-400.svg
fa-regular-400.ttf
fa-regular-400.woff
fa-regular-400.woff2
So i place this package in my resources/assets/sassdirectory.
所以我把这个包放在我的resources/assets/sass目录中。
resources:.
└───asset
└───sass
│ main.scss
│
└───font-awesome (directory)
main.scsscontains code:
main.scss包含代码：
@import 'font-awesome/scss/fontawesome';
webpack.mix.jscontains:
webpack.mix.js包含：
mix.sass('resources/assets/sass/main.scss', 'public/css/frontend.css');
All assets are compiled successfully. Now publicdirectory has a cssand fontdirectory, which has all fonts like this.
所有资产都编译成功。现在public目录有一个css和font目录，里面有所有这样的字体。
public:.
│ index.php
│
├───css
│ frontend.css
│
├───fonts
│ fa-regular-400.eot
│ fa-regular-400.svg
│ fa-regular-400.ttf
│ fa-regular-400.woff
│ fa-regular-400.woff2
But What I want is, I don't want to compile all fonts into public/fontsdirectory i want to compile as following structure public/fonts/vendor/font-awesome
但我想要的是，我不想将所有字体编译到public/fonts我想编译为以下结构的目录中public/fonts/vendor/font-awesome
public:.
├───css
│ frontend.css
│
└───fonts
└───vendor
└───font-awesome
fa-regular-400.eot
fa-regular-400.svg
fa-regular-400.ttf
fa-regular-400.woff
fa-regular-400.woff2
What changes that i need to change in webpack.mix.jsfile.
我需要在webpack.mix.js文件中更改哪些更改。
采纳答案by Ahmad Hussnain
1. First Create a explicit folder structure:
1.首先创建一个明确的文件夹结构：
like this in your laravel project.
在你的 Laravel 项目中是这样的。
public/fonts/vendor/font-awesome
public/fonts/vendor/font-awesome
Move all your fonts from font-awesomepackage to above mention directory.
将所有字体从font-awesome包移动到上述目录。
2. Change $fa-font-path variable value:
2. 更改 $fa-font-path 变量值：
font-awesomedirectory has a file called _variables.scssinside that file there is a variable named as $fa-font-pathchange the value to something like this.
font-awesome目录中有一个_variables.scss在该文件中调用的文件，其中有一个变量名为$fa-font-path将值更改为这样的值。
$fa-font-path: "/fonts/vendor/font-awesome" !default;
Compile your assets it would work.
编译你的资产，它会起作用。
回答by Farid Vatani
If you want to use the laravel-mix and try to change public/fontsto public/assets/fontsdirectory,
You can use this code in your webpack.mix.js
如果你想使用 laravel-mix 并尝试切换public/fonts到public/assets/fonts目录，你可以在你的webpack.mix.js
let mix = require('laravel-mix');
mix.config.fileLoaderDirs.fonts = 'assets/fonts';
回答by Arash Hatami
Try to copy them directly like this :
尝试像这样直接复制它们：
mix.copyDirectory('assets/font-awesome/webfonts', 'public/fonts');
Or you can copy files one by one :
或者您可以一个一个地复制文件：
mix.copy('assets/font-awesome/webfonts/example.ttf', 'public/fonts/example.ttf');
回答by Temitayo
In addition to @farid-hatami answer, you can also append to the generated URL with.
除了@farid-hatami 答案，您还可以附加到生成的 URL 中。
mix.setResourceRoot('/public')
This is useful if you're running backends like Django where you have to be explicit with your url.
如果您正在运行像 Django 这样的后端，您必须明确使用您的 url，这将非常有用。
