在前端開發中，CSS樣式是必不可少的。隨著項目的不斷擴大，CSS文件也會變得越來越龐大，文件的請求和加載也會變得越來越慢。所以，我們需要將CSS樣式打包成一個個獨立的文件，以優化頁面加載速度。下面，讓我們來看看如何把CSS樣式打包。

首先，我們需要一個CSS預處理器，如Sass或Less。它能夠讓我們寫更加簡潔、易讀的CSS代碼，并且能夠自動為我們的CSS文件添加前綴、壓縮、合并等效果，提高代碼質量與可維護性。
接著，我們需要使用打包工具，如Webpack或Rollup。它能夠將所有的CSS文件打包成一個獨立的文件，并且消除重復的代碼，減小文件體積。
在webpack中，我們需要使用特定的CSS loader和CSS打包插件，如css-loader和mini-css-extract-plugin。我們只需要在Webpack的配置文件中設置好相應的loader和plugin，就可以輕松的將CSS文件打包。
有時候，我們還需要調整CSS的加載順序，以確保優化加載速度。我們可以使用Webpack的entry屬性，以確定CSS文件的加載順序。
最后，我們需要在HTML中引用CSS文件。我們可以使用Webpack的HtmlWebpackPlugin插件實現這個功能，并且指定引用的CSS文件名。這樣，我們就成功將CSS樣式打包了!

總之，把CSS樣式打包的過程是相對簡單的。我們只需要使用CSS預處理器以及打包工具，就可以輕易的將CSS樣式打包成一個獨立的文件，優化頁面加載速度。希望這篇文章對你有所幫助！