如何使用lost，autoprefixer和postcss-flexibility？ [英] How to use lost, autoprefixer and postcss-flexibility?

问题描述

我想知道应该使用自动前缀，丢失，的顺序在 webpack 中的postcssflexibility 吗？

I want to know the order in which we should use autoprefixer, lost, postcssflexibility in webpack ?

推荐答案

一个基本示例（通过postcss前缀，应用precss插件等）。

Here's a basic example (prefixing through postcss, applying precss plugin etc.).

const autoprefixer = require('autoprefixer');
const precss = require('precss');

module.exports = {
  module: {
    loaders: [
      {
        test: /\.css$/,
        loaders: ['style', 'css', 'postcss'],
      },
    ],
  },
  // PostCSS plugins go here
  postcss: function () {
    return [autoprefixer, precss];
  },
};

webpack 2

webpack 2

module: {
  rules: [
    {
      test: /\.css$/,
      use: [
        'style-loader',
        'css-loader',
        {
          loader: 'postcss-loader',
          options: {
            ident: 'postcss', // Needed for now
            plugins: function () {
              // Set up plugins here
              return [
                require('autoprefixer'),
                require('precss'),
              ];
            },
          },
        },
      ],
    },
  ],
},

另一种方法是按照postcss.config.js https://www.npmjs.com/package/postcss-loader rel = nofollow noreferrer> postcss-loader 文档。

Another way would be to push the plugins to postcss.config.js as instructed in the postcss-loader documentation. It is more difficult to compose that, though.

来源。

这篇关于如何使用lost，autoprefixer和postcss-flexibility？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！