Comment puis-je importer des fichiers importés avec postcss-import et Webpack 2?

Question

Puis-je utiliser postcss-import pour l'importation de Bootstrap?

Voici une partie de ma config webpack:

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

Et je suis en train d'importer Bootstap installé avec NPM:

@import 'bootstrap/dist/css/bootstrap.css'; 

Et j'ai une erreur:

./~/css-loader?{"importLoaders":1,"modules":true,"localIdentName":"[folder]__[local]___[hash:base64:5]"}!./~/postcss-loader/lib!./src/css/app.css 
Module not found: Error: Can't resolve '../fonts/glyphicons-halflings-regular.eot' in '/home/entry/Dev/project/src/css' 
@ ./~/css-loader?{"importLoaders":1,"modules":true,"localIdentName":"[folder]__[local]___[hash:base64:5]"}!./~/postcss-loader/lib!./src/css/app.css 6:4601-4653 6:4676-4728 
@ ./src/css/app.css 
@ ./src/js/backoffice/index.js 
@ ./src/main.js 
@ multi ./scripts/config/polyfills.js ./src/main.js 

./~/css-loader?{"importLoaders":1,"modules":true,"localIdentName":"[folder]__[local]___[hash:base64:5]"}!./~/postcss-loader/lib!./src/css/app.css 
Module not found: Error: Can't resolve '../fonts/glyphicons-halflings-regular.woff2' in '/home/entry/Dev/project/src/css' 
@ ./~/css-loader?{"importLoaders":1,"modules":true,"localIdentName":"[folder]__[local]___[hash:base64:5]"}!./~/postcss-loader/lib!./src/css/app.css 6:4778-4832 
@ ./src/css/app.css 
@ ./src/js/backoffice/index.js 
@ ./src/main.js 
@ multi ./scripts/config/polyfills.js ./src/main.js 

........ 

Aussi j'utilise url-loader comme chargeur par défaut

{ 
    exclude: [ 
     /\.html$/, 
     /\.js$/, 
     /\.css$/, 
     /\.json$/, 
    ], 
    loader: 'url-loader', 
    options: { 
     limit: 10000, 
     name: 'static/media/[name].[hash:8].[ext]', 
    }, 
    }, 

J'utilise webpack v.2.1.3, postcss-chargeur v.2.0.6, postcss-import v.11.0.0

Answer 1

Vous devez ajouter à votre ident: 'postcss',postcss-loader config pour faire cela fonctionne:

{ 
    loader: 'postcss-loader', 
    options: { 
    ident: 'postcss', 
    } 
}, 

Vous pouvez en savoir plus sur cette question: https://github.com/facebookincubator/create-react-app/issues/2677