node项目中不同位置设置browserslist对postcss-loader影响的权重

1) 在webpack.config.js重写browserslist
webpack.config.js > module > rules >

{
    test: /\.css$/,
    use: [
        ...其他loader
        {
            loader: 'postcss-loader',
            plugins: [
                require('autoprefixer'({overrideBrowserslist: ['>0.01%']})
            ]
        }
    ]

2) 在postcss.config.js文件中的重写browserslist

module.exports = {
    plugins: [
      require('autoprefixer')({
      overrideBrowserslist: ['>0.01%']
    })
]

3) 在package.json中配置browserslist

"browserlist": ['>0.01%']

4) 根目录下的.browserslistrc文件中的配置项

last 2 versions
>0.01%
iso 7

总结:
1) webpack.config.js > postcss.config.js
2) postcss.config.js > .browserslistrc
3) postcss.config.js > package.json
4) package.json和.browserslistrc只能定义一个, 否则会冲突


结论: webpack.config.js在查找browserslist是从内向外找的, 找到就会停下来

阅读 367

推荐阅读