Webpack ne peut pas charger le fichier de police: jeton inattendu

J’ai un fichier style.css qui utilise un fichier de fonts et j’ai des difficultés à charger le fichier de fonts à l’aide de Webpack. Voici ma configuration de chargeur:

loaders : [ { test : /\.(js|jsx)$/, exclude : /node_modules/, loader : 'react-hot!babel-loader' }, { test : /\.styl/, loader : 'style-loader!css-loader!stylus-loader' }, { test : /\.css$/, loader : 'style-loader!css-loader' }, { test : /\.(png|jpg)$/, loader : 'url-loader?limit=8192' }, { test : /\.(ttf|eot|svg|woff(2))(\?[a-z0-9]+)?$/, loader : 'file-loader' } /*}, { test : /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader : 'url-loader?limit=10000&minetype=application/font-woff'*/ ] 

Les erreurs que je reçois sont

 ERROR in ./src/fonts/icon/fonts/mf-font.woff?lt4gtt Module parse failed: /PATH/src/fonts/icon/fonts/mf-font.woff?lt4gtt Line 1: Unexpected token ILLEGAL You may need an appropriate loader to handle this file type. (Source code omitted for this binary file) @ ./~/css-loader!./src/fonts/icon/style.css 2:293-331 

Il me semble que Webpack le prend comme un fichier CSS quand ce n’est pas le cas. Mais je suis sûr que l’expression de test passe pour le fichier de police

Le regex dans votre expression de test a une petite erreur. woff(2) signifie qu’il recherche toujours woff2 et capture simplement les 2 dans un groupe séparé. Si vous ajoutez un ? Après cela, webpack devrait être capable de reconnaître également:

 test : /\.(ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/, loader : 'file-loader' 

S’il vous plaît laissez-moi savoir si cela a fonctionné.

Cela a fait le tour pour moi:

 { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff" }, { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" },