postcss-loader配合autoprefixer給css加瀏覽器前綴名

1. 安裝

npm i postcss-loader autoprefixer -D

2. 在webpack.config.js 中配置

3.查看index.html 中 引入的 "dest/bundle.js"(webpack 輸出地址)中引入的index.css文件(使用的是require("../css/index.css"))

4.此時在文件根目錄的命令行中輸入 webpack 此時的transform是沒有瀏覽器前綴的

5.解決上面沒有出來瀏覽器前綴的方式有兩個

第一個: 增加一個.browserslistrc文件

我們還需要增加一個.browserslistrc文件,此文件裏面的內容爲

last 5 version  ==>  落後最新瀏覽器版本的5個版本之內

> 1%   ==> 支持市場使用率>1%的瀏覽器

此時查看結果

第二個: 在packjson.js 中新增一個配置項, "browserslist", 裏面就是瀏覽器前綴的限制