鍍金池/ 問答/HTML/ 用了 mini-css-extract-plugin 之后postcss 不能加

用了 mini-css-extract-plugin 之后postcss 不能加后綴

{
        test: /\.(sass|scss)$/,
        use: [{
            loader: MiniCssExtractPlugin.loader,
            options: {
              publicPath: "../"
            }
          },
          "css-loader",
          "postcss-loader",
          "sass-loader"
        ]
      },
      
      
    // postcss.config.js
     module.exports = {
  plugins: [
    require("autoprefixer"),
    // reuqire('postcss-import')
  ]

new MiniCssExtractPlugin({
      filename: "css/[name].[hash:6].css",
      // chunkFilename: "css/[name].[hash:6].css",

    }),
}
回答
編輯回答
舊酒館

將

"css-loader",
"postcss-loader",

改為：

{loader: 'css-loader',options: { importLoaders: 1 }},
{loader: 'postcss-loader',options: { config: { path: path.resolve(__dirname, './postcss.config.js') } },

我是在這里找到的答案：
https://github.com/webpack-co...

2017年9月30日 20:25
編輯回答
枕邊人

這個問題好像無關(guān)于mini-css-extract-plugin，即使你換成extract-text-plugins依然不行。
在postcss.config.js里，需要對autoprefixer進(jìn)行配置，更準(zhǔn)確說是對瀏覽器的兼容范圍進(jìn)行設(shè)置，在默認(rèn)情況下會選擇在一定范圍的（沒看到默認(rèn)是多少，可能是>5%）.
解決辦法：1：

module.exports = {
  plugins: [
    require('autoprefixer')({
      browsers: ['cover 99.5% in CN']
    })
  ]
}

2：官方文檔里更推薦是寫在package.json中或者有一個單獨文件對browserlist進(jìn)行配置

  "browserslist": ["cover 99.5% in CN"]

這里的意思是覆蓋99.5%的瀏覽器，地區(qū)是中國。更多請查看autoprefixer以及browserslist的Github文檔

2018年4月20日 18:44