Webpack: comment ajouter un composant?

Question

Je dois ajouter un component (module) à mon configuration. Comment le faire correctement?

Je reçois cette erreur:

[1] ERROR in ./node_modules/font-awesome/css/font-awesome.css 
[1] Module parse failed: C:\Users\steko\Desktop\webpack-electron-react-sass-conf\node_modules\font-awesome\css\font-awesome.css Unexpected character '@' (7:0) 
[1] You may need an appropriate loader to handle this file type. 
[1] | /* FONT PATH 
[1] | * -------------------------- */ 
[1] | @font-face { 
[1] | font-family: 'FontAwesome'; 
[1] | src: url('../fonts/fontawesome-webfont.eot?v=4.7.0'); 
[1] @ ./node_modules/react-fa/lib/index.js 13:0-44 
[1] @ ./src/AwesomeComponent.jsx 
[1] @ ./src/index.jsx 

C'est étrange, parce que j'ajouté le style chargeur pour css. Comment le réparer?

git

Answer 1

@VINET Vous devez ajouter une règle pour traiter les fichiers CSS dans votre webpack conf.

Essayez d'ajouter la règle suivante dans votre configuration

{ 
    test: /\.css$/, 
    loader: "style-loader!css-loader" 
    }, 

Answer 2

essayez d'utiliser le chargeur URL pour les fichiers de police dans webpack.config

{ 
    test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, 
    loader: 'url-loader?mimetype=application/font-woff', 
    }, 
    { 
    test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, 
    loader: 'url-loader?mimetype=application/font-woff', 
    }, 
    { 
    test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, 
    loader: 'url-loader?mimetype=application/octet-stream', 
    }, 
    { 
    test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, 
    loader: 'url-loader', 
    },