reac-toolbox css config dans le webpack 2 ne fonctionne pas

Question

Je travaille avec webpack et j'ai essayé de configurer la bibliothèque reac-toolbox. J'ai réussi à le faire fonctionner mais le css ne se charge pas.

webpack.config.js

Answer 1

Vous n'avez pas configuré votre chargeur de style pour émettre des modules CSS

Ajoutez ceci à votre style loader

loader: 'style!css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss' 

Cela activera les modules CSS, et mettre également en place pour permettre à postCSS de s'y connecter

Rappelez-vous que cela va maintenant traiter .scss ou .css fichier en tant que module scope localement, donc si vous avez une SCSS normale séparée ou CSS que vous voulez rester globale, vous devrez ajouter une autre règle pour les

// EDIT

Il peut être confondu à l'aide la chaîne de chargeur si vos autres configs chargeur sont encore en ce tableau (comme la chaîne ci-dessus est un raccourci pour les combiner), essayez au lieu d'utiliser séparément les objets de configuration ...

{ 
    test: /\.css$/, 
    use: [ 
    'style-loader', 
    { 
     loader: 'css-loader', 
     options: { 
     importLoaders: 1, 
     localIdentName: '[name]__[local]___[hash:base64:5]', 
     modules: true 
     } 
    }, 
    { 
     loader: 'postcss-loader', 
     options: { 
     plugins: [ 
      postcssNext 
     ] 
     } 
    } 
    ] 
} 

React Toolbox n'utilise plus SCSS ayant migré PostCSS donc je l'ai laissé - si vous l'utilisez, ajoutez-le de la même manière