第九章 CSS工程化方案
一、概述
1.1、PostCSS
二、PostCSS插件的使用
全局安裝postcss工具。
npm install postcss-cli -g
編譯css
2.1、autoprefixer的使用
首先需要安裝autoprefixer插件
npm install autoprefixer
2.2、postcss-import的使用
如上圖,如果是這樣引入css文件的話,就會調用兩個請求。如果用下面的這個插件後重新編譯,那麼就會合並css文件。
2.3、cssnano的使用
cssnano是用來壓縮代碼的
2.4、cssnext的使用
這個插件也需要npm安裝。
執行編譯後
2.5、precss的使用
需要安裝過插件。配置執行後如下面的圖。
2.6、glup-postcss構建工具的使用
四、webpack插件的使用
html引用了打包後的js文件。
4.1、webpack處理css
安裝css加載插件
創建配置文件,webpack.config.js是webpack配置文件的默認文件名。
PS:後期繼續