gulp 配置 autoprefixer 报出警告问题

最新推荐文章于 2024-07-02 18:08:49 发布

原创最新推荐文章于 2024-07-02 18:08:49 发布 · 置顶 · 401 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#webpack

webpack 专栏收录该内容

14 篇文章

订阅专栏

本文介绍如何解决Gulp Autoprefixer控制台警告问题，通过将browsers选项替换为Browserslist配置，以避免错误并确保代码兼容性。详细步骤包括在package.json或.browserslistrc文件中使用browserslist键，以及如何正确修改代码。

今天在配置gulp autoprefixer 控制台出现了警告问题，

Replace Autoprefixer browsers option to Browserslist config.
  Use browserslist key in package.json or .browserslistrc file.

  Using browsers option cause some error. Browserslist config 
  can be used for Babel, Autoprefixer, postcss-normalize and other tools.

  If you really need to use option, rename it to overrideBrowserslist.

  Learn more at:
  https://github.com/browserslist/browserslist#readme
  https://twitter.com/browserslist

原来代码

{
                    loader: 'postcss-loader',
                    options: {
                        ident:'postcss',
                        sourceMap:true,
                        plugins:(loader)=> [
                            require("autoprefixer")({
                                browsers: [ // 设置浏览器版本
                                  'last 10 Chrome versions',
                                  'last 5 Firefox versions',
                                  'Safari >= 6', 
                                  'ie> 8'
                                ] 
                             })/*在这里添加*/
                        ]
                    }

修改后

{
                    loader: 'postcss-loader',
                    options: {
                        ident:'postcss',
                        sourceMap:true,
                        plugins:(loader)=> [
                            require("autoprefixer")({
                                overrideBrowserslist: [ // 设置浏览器版本
                                  'last 10 Chrome versions',
                                  'last 5 Firefox versions',
                                  'Safari >= 6', 
                                  'ie> 8'
                                ] 
                             })/*在这里添加*/
                        ]
                    }
                  }