Webpack：爲什麼'style-loader！css-loader！postcss-loader'不處理導入的文件？

Question

我有page.css @imports index.css。

page.css和index.css都有display: flex。

Webpack.config.js包含：

module: { 
    loaders: [ 
     { test: /\.css$/, loader: "style-loader!css-loader!postcss-loader" } 
    ] 
}, 
postcss: function() { 
    return [ autoprefixer({ browsers: ['last 5 versions'] }) ]; 
} 

建設後，我從page.css規則有前綴但是從規則index.css左無前綴。我究竟做錯了什麼？

Answer 1

使用postcss-import插件通過內聯內容來轉換@import規則。

module: { 
    loaders: [ 
     { test: /\.css$/, loader: "style-loader!css-loader!postcss-loader" } 
    ] 
}, 
postcss: function() { 

    return [ 
     require('postcss-import')(), 
     autoprefixer({ browsers: ['last 5 versions'] }) 
    ]; 
}