Vue2 vue-cli 中stylus 報錯unexpected indent
阿新 • • 發佈：2019-01-27
用Vue-cli構建專案的時候，用stylus寫樣式，各種報錯 unexpected indent 。浪費了兩個小時的時間終於搞明白了問題。
踩坑
如下圖：
新增background-size屬性的時候，就會報出這個錯誤。
很明顯意思就是縮排錯誤。但是我怎麼看也看不出所以然。
嘗試解決
各種搜尋，google， stractoverflow…
得到的資訊是 : tab和空格混用縮排，導致stylus編譯出錯
嗨，rewrite my code.
如下圖：
嗯，這次不報錯了。但是我對比了下。發現這兩次的程式碼並沒有什麼不同！
但是管不了了，繼續專案吧。專案能跑起來就行~！
解決問題
但是，就在我快寫完了樣式，但是遇到一個要絕對定位的元素，於是找到父元素，新增position:relative屬性。發現： 又報同樣的錯誤了！！！！
既然是tab和空格縮排，但是由於本人已經習慣了，空格，tab混用。那麼能不能在我的sublime text3 裡區別一下空格和tab形成的縮排呢。哈哈 可喜的是： 能！
找到Preference > settings(user) 裡
“draw_white_space” 設定為 “all”
"draw_white_space": "all",這個時候看sublime text3 如下圖：
明顯的看到：哪些用了空格，哪些用了tab。統一風格後，哈哈。再也不擔心報錯啦！~