change font compile path in webpack mix laravel Code Answer

Hello Developer, Hope you guys are doing great. Today at Tutorial Guruji Official website, we are sharing the answer of change font compile path in webpack mix laravel without wasting too much if your time.

The question is published on by Tutorial Guruji team.

i’m using laravel mix and i want compile my fonts. My fonts are compiled but their names are read from root. See my code at the bottom.

@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/product-fonts/icomoon.eot');
  src:  url('../fonts/product-fonts/icomoon.eot') format('embedded-opentype'),
        url('../fonts/product-fonts/icomoon.ttf') format('truetype'),
        url('../fonts/product-fonts/icomoon.woff') format('woff'),
        url('../fonts/product-fonts/icomoon.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

this is my sass code and Eventually The compilation will be as follows :

@font-face {
  font-family: 'icomoon';
  src: url(/fonts/icomoon.eot?c2f80bad46e9a20b6278361015fef1cd);
  src: url(/fonts/icomoon.eot?c2f80bad46e9a20b6278361015fef1cd) format("embedded-opentype"), url(/fonts/icomoon.ttf?5fa3cdef859a193e0f02c75fbd91d73a) format("truetype"), url(/fonts/icomoon.woff?96c27a3f7e16f9927cc8a0d2818c4e8e) format("woff"), url(/fonts/icomoon.svg?6e4d8f919ddb5d210c8807eb99149359) format("svg");
  font-weight: normal;
  font-style: normal;
}

But I want to compile the following:

@font-face {
  font-family: 'icomoon';
  src: url(../fonts/icomoon.eot?c2f80bad46e9a20b6278361015fef1cd);
  src: url(../fonts/icomoon.eot?c2f80bad46e9a20b6278361015fef1cd) format("embedded-opentype"), url(../fonts/icomoon.ttf?5fa3cdef859a193e0f02c75fbd91d73a) format("truetype"), url(../fonts/icomoon.woff?96c27a3f7e16f9927cc8a0d2818c4e8e) format("woff"), url(../fonts/icomoon.svg?6e4d8f919ddb5d210c8807eb99149359) format("svg");
  font-weight: normal;
  font-style: normal;
}

Because my css file is in another folder

Answer

try with setting resource root

mix.setResourceRoot(‘../’);

this is worked fine for me 🙂

We are here to answer your question about change font compile path in webpack mix laravel - If you find the proper solution, please don't forgot to share this with your team members.

Related Posts

Tutorial Guruji