解決Vue項目中Eslint校驗代碼報錯的問題

在使用腳手架創建Vue項目時,一般會安裝Eslint插件,這個主要是校驗代碼格式和規範用的,但是它很有點讓人抓狂,因爲很多校驗規則和代碼規範,你只要不按照它的格式來,直接導致項目編譯報錯,運行不了項目,這個是非常令人討厭的。它不像idea裏安裝alibaba插件,校驗代碼規範只是會提示,並不會導致你項目都不能編譯和運行。尤其小白剛學習Vue和使用這插件時,那簡直是痛苦不堪,深受其害(有人說不裝那插件不就行了,但個人覺得,代碼規範任何時候都很重要,裝了是利大於弊),網上看過很多解決方法,零零散散有的也不好使,自己找了一套解決方法,挺好用的,記錄一下。說了這麼多,總結一下我自己解決這些問題的辦法。

1.空格縮進,不讓使用tab

具體英語怎麼表達忘記了,看到就知道了。這個錯誤不是一般的讓人煩,簡直有些讓人無語,誰用誰知道,因爲大多習慣用tab。

先在.eslintrc.js文件裏配置rules(有的項目沒有這個文件,具體爲什麼我還不清楚,沒有的話就自己創建一個吧,按如下格式):我是直接把indent(縮進)給關掉了,也可以配置其他值,我沒嘗試,這種方式簡單粗暴

然後,需要在package.json裏配置rules,這個也要配置的,不然上面配置的rules不會生效:

2.未使用的變量報錯

idea裏這個問題一般只是變量灰色的提示未使用,但是Vue項目裏Eslint編譯不通過。

同上,先在.eslintrc.js文件裏配置,然後在package.json裏配置,配置項爲:“no-unused-vars”:"off",需要注意的是兩個文件裏配置的格式不一樣,一個是json格式,一個是單引號格式。

3.分號和引號問題

這個提示錯誤沒法關掉,Eslint要求字符串使用單引號,行末不能有多餘的分號,這個也很煩,與我們常用習慣相違背。

可以在項目目錄下新建一個.prettierrc文件,這是一個json格式的文件,加上配置,項目啓用它就可以生效。

這裏我加了兩項,第一個就是行末分號取消,第二個就是字符串默認使用單引號,當我們寫好代碼後,格式化代碼(我之前用Eclipse,現在用的idea,格式化代碼快捷鍵都是設置的ctrl+shift+F),idea就會幫你把分號自動去掉,把雙引號替換爲單引號。如果還有其他規則,也可以往這個文件裏添加。

以上只是我覺得幾個比較常見又很煩的規則,配置後解決了寫代碼心情舒暢,其他還有什麼自己不喜歡的校驗規則可以用同樣的方式配置重啓即可解決。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章