在现有项目中使用 tailwindcss 时是否还需要使用autoprefixer？

Question

问题描述

历史项目中基本都会使用CSS预处理器，之后如果加入 TailwindCSS 的话，是否还需要添加 autoprefixer 这个插件？

问题出现的环境背景及自己尝试过哪些方法

因为CSS预处理器也会有自己的 autoprefixer 插件，例如说 autoprefixer-stylus。

相关代码

// vue.config.js
const autoprefixer = require('autoprefixer-stylus')

module.exports = {
  ...
  css: {
    loaderOptions: {
      stylus: {
        use: [
          autoprefixer({ browsers: ['last 2 versions', '> 1%'] })
        ]
      }
    }
  }
}

你期待的结果是什么？实际看到的错误信息又是什么？

是否可以在 PostCSS 中不启用 autoprefixer，还是说可以移除原本的CSS预处理器中相关的 autoprefixer 插件转而使用 PostCSS 的 autoprefixer 插件？

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 1

理论上来说，不需要，其实你看一下 autoprefixer-stylus 的依赖，它其实就是包了一层 postcss+autoprefixer。

不过我的建议是，移除预处理工具里的插件，将 postcss 作为 pipeline 的最后一环，然后慢慢迁移到 tailwindCSS 来。