stylus是乙個css預處理器，比較流行的css預處理器有sass、less、stylus，它們都一樣，都是css的語法糖，可以使用變數，可以有簡單的邏輯，使css的開發效率更高，更易維護。stylus來自node社群，它的語法相容性強，個人覺得也更加簡潔，選擇在vue中使用。以webpack模板為例，在webpack的loader配置中，已經做好了stylus的相容，build/utils.js中已有對loader的配置，但預設沒有stylus包和loader包，需要安裝：
cnpm i stylus -d
cnpm i stylus-loader
-d
vue-cli腳手架搭建的專案中用的是.vue檔案，檔案裡面有三個部分，模板（template）、指令碼（script）、樣式表（style）。
其中的style，宣告一下是stylus型別：
lang="stylus"
rel="stylesheet/stylus">
style>
stylus檔案字尾為.styl，不是.css，這和sass、less一樣，要不然怎麼知道用的是stylus語法。
外部建好檔案以後，.vue中引入：
import
'.styl路徑'
css的各預處理器學習門檻都是很低，畢竟只是語法糖。
segmentfault中的詳細總結：大神的中文翻譯手冊：
stylus官方文件：
在vue 中使用Stylus
對於電腦配置較高的記憶體較大的，推薦使用webstorm，這個編輯器很智慧型也很龐大，對於電腦配置稍低的，推薦使用後面兩個。另外，在編輯 時，當時用後兩種編輯器時，很依賴各種各樣的外掛程式 當你覺得使用的時候很不爽的時候 就去網上搜相應的外掛程式 比如我需要vue高亮語法的外掛程式，就去搜尋安裝vu...
vue 樣式中的stylus
專案中如果多個地方都用的同一色值，並且有時候需要根據節日或者活動需要更改主題色即可用stylus來實現哦。一 stylus的檔案是.styl 二 style中的樣式引入 import assets var.styl 三 stylus語法 bg orange使用示例 在assets資料夾中建立them...
Vue 中全域性引入 stylus
目錄 一 安裝 二 vue.config.js 中配置 三 主題切換 npm i style resources loader d主要是方法 importstylus，然後在 module.exports.chainwebpack 中引入。配置完成後，一定要重啟專案才生效。const webpack...