Ausführliche Erklärung zur Konfiguration des PostCSS-Loaders mit Webpack2.0

In diesem Artikel wird hauptsächlich die Methode zum Konfigurieren des Postcss-Loaders in Webpack 2.0 vorgestellt. Der Herausgeber findet sie recht gut, daher werde ich sie jetzt mit Ihnen teilen und als Referenz verwenden. Folgen wir dem Editor und werfen wir einen Blick darauf

In diesem Artikel erfahren Sie, wie Sie den Postcssloader mit webpack2.0 konfigurieren und mit allen teilen. Die Details lauten wie folgt:

Postcss-loader installieren

npm install --save-dev postcss-loader

Anschließend webpack.config.js konfigurieren

{
 test:/\.css$/,
 use:[
  'style-loader','css-loader?importLoaders=1','postcss-loader' 
 ] 
}

Eine Möglichkeit besteht darin, postcss.config.js zu konfigurieren

module.exports = {
  plugins: [
    require('autoprefixer')({ /* ...options */ })
  ]
}

Die zweite Methode ist die Verwendung von LoaderOptionsPlugin

module.exports = {
  plugins: [
    new webpack.LoaderOptionsPlugin({
      options: {
        postcss: function(){
          return [
            require("autoprefixer")({
              browsers: ['ie>=8','>1% in CN']
            })
          ]
        }
      }
    })
  ]
}

in webpack.config.js

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zur Konfiguration des PostCSS-Loaders mit Webpack2.0. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!