Woff und TTF Schriftarten 404 nicht gefunden

Question

Ich benutze Webpack, um meine Sass-Dateien zu kompilieren. Ich habe ein font-face die wie folgt aussieht:

@font-face 
    font-family: "Alef" 
    src: url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.eot") 
    src: url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.eot?#iefix") format("embedded-opentype"), url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.woff") format("woff"), url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.ttf") format("truetype"), url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.svg#alefbold") format("svg") 
    font-weight: bold 
    font-style: normal 

und dies ist, wie die Lader in meiner webpack Konfigurationsdatei

{ 
       test: /\.html$/, 
       loader: 'html' 
      }, 
      { 
       test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?[a-z0-9=&.]+)?$/, 
       loader: 'file?name=assets/[name].[hash].[ext]' 
      }, 
      { 
       test: /\.sass$/, 
       exclude: /node_modules/, 
       loader: 'raw-loader!sass-loader' 
      }, 
      { 
       test: /\.css$/, 
       exclude: helpers.root('src', 'app'), 
       loader: ExtractTextPlugin.extract('style', 'css?sourceMap') 
      }, 
      { 
       test: /\.css$/, 
       include: helpers.root('src', 'app'), 
       loader: 'raw' 
      } 

aber ich erhalte 404 auf dem ttf und woff sehen aus wie

, also diese schrift erscheint nur in chrom (erscheint nicht in firefox und edge)

danke!

Answer 1

Gelöst! Ich trennte die srcs, wie folgt aus:

@font-face 
    font-family: "Alef" 
    src: url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.eot") 
    src: url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.eot?#iefix") format("embedded-opentype") 
    src: url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.woff") format("woff") 
    src: url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.ttf") format("truetype") 
    src: url("..\..\public\fonts\Alef\Alef-Webfont\Alef-Bold.svg#alefbold") format("svg") 
    font-weight: bold 
    font-style: normal