WebpackとPostCSS AutoprefixerがSassパーシャルをコンパイルしていない

Question

Webpackを使用してSassをコンパイルしていて、PostCSSオートプレフィクサーがstyle.scssエントリポイントにインポートされたパーシャルでは機能していません。

style.scssに直接スタイルを追加すると、予期したとおりに接頭辞が付けられますが、@importとして参照されているファイルは自動接頭辞付けされていません。

私はwebpack.config、postcss.configとstyle.scssを以下のように追加しました。

@import url('//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); 
@import 'partials/admin'; 
@import 'partials/nav'; 
@import 'partials/photos'; 
@import 'partials/no-results'; 
.test{ 
    display: flex; // <- This is being prefixed as expected. 
} 

webpack.config.js

var ExtractTextPlugin = require('extract-text-webpack-plugin'); 
var path = require('path'); 

module.exports = { 
    entry: ['./src/js/index.js', './src/scss/style.scss'], 
    output: { 
     filename: './js/bundle.js', 
     path: path.join(__dirname, 'dist'), 
     publicPath: './dist/' 
    }, 
    watch: true, 
    module: { 
     loaders: [ 
     { 
      test: /.jsx?$/, 
      loader: 'babel-loader', 
      exclude: /node_modules/, 
      query: { 
       presets: ['es2015', 'react'] 
      } 
     }, 
     { 
      test: /\.(png|jpg|gif)$/, 
      use: [ 
       { 
        loader: 'url-loader', 
        options: {} 
       } 
      ] 
     }, 
     { 
      test: /\.scss$/, 
      use: ExtractTextPlugin.extract({ 
       fallback: "style-loader", 
       use: ['css-loader', 'sass-loader', 'postcss-loader'] 
      }), 
      exclude: /node_modules/, 
     } 
    ]}, 

    plugins: [ 
     new ExtractTextPlugin({ filename: './css/style.css' }) 
    ] 

}; 

postcss.config.js

module.exports = { 
    map: false, 
    plugins: { 
    'autoprefixer': {browsers: ['last 2 versions', '> 5%']}, 
    } 
} 

style.scssはTHERです特別なローダーや構文がありません。@importファイルが自動プレフィックスされていますか？

* EDIT *

私はSCSSローダーの順序を調整することにより、この問題を解決することができました。

{ 
test: /\.scss$/, 
use: ExtractTextPlugin.extract({ 
    fallback: "style-loader", 
    use: [ 
    { loader: 'css-loader' }, 
    { loader: 'postcss-loader' }, 
    { loader: 'sass-loader', 
     options: { 
      outputStyle: 'expanded' 
     }, 
    } 
    ] 
}), 
exclude: /node_modules/, 
} 

Answer 1

あなたは、私はさらにpostcss.config.jsを提供postcss-scss

をしようとする場合があります：

module.exports = { 
parser: 'postcss-scss', 
plugins: [ 
    require('autoprefixer'), 
] 
} 

幸運