使用postcss-loader 可以配置打包css文件时自动增加浏览器前缀。
postcss-preset-env 允许开发者使用最新的CSS语法而不用担心浏览器兼容性。postcss-preset-env 会将最新的CSS语法转换为目标环境的浏览器能够理解的CSS语法。
参考文章：https://blog.csdn.net/sd19871122/article/details/108894286

方案一：配合 autoprefixer 使用

在页面下新建文件 postcss.confihg.js 文件
image.png
配置好之后在 webpack.config.js 文中使用
image.png
使用之后打包时报错：
image.png

方案二：配合 postcss-preset-env 使用

postcss.config.js 文件
image.png
需要在 package.json 文件中添加

  1. "browserslist": [
  2.       "defaults",
  3.       "not ie < 8",
  4.       "last 2 versions",
  5.       "> 1%",
  6.       "iOS 7",
  7.       "last 3 iOS versions"
  8.     ],

其他配置不变。打包成功！