vue Eslint校驗代碼報錯

在使用腳手架創(chuàng)建Vue項目時，一般會安裝Eslint插件，這個主要是校驗代碼格式和規(guī)范用的，但是它很有點讓人抓狂，因為很多校驗規(guī)則和代碼規(guī)范，你只要不按照它的格式來，直接導致項目編譯報錯，運行不了項目，這個是非常令人討厭的。

它不像idea里安裝alibaba插件，校驗代碼規(guī)范只是會提示，并不會導致你項目都不能編譯和運行。尤其小白剛學習Vue和使用這插件時，那簡直是痛苦不堪，深受其害（有人說不裝那插件不就行了，但個人覺得，代碼規(guī)范任何時候都很重要，裝了是利大于弊），網(wǎng)上看過很多解決方法，零零散散有的也不好使，自己找了一套解決方法，挺好用的，記錄一下。

說了這么多，總結一下我自己解決這些問題的辦法。

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

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

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

然后，需要在package.json里配置rules，這個也要配置的，不然上面配置的rules不會生效：

2.未使用的變量報錯

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

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

3.分號和引號問題

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

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

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

這只是我覺得幾個比較常見又很煩的規(guī)則，配置后解決了寫代碼心情舒暢，其他還有什么自己不喜歡的校驗規(guī)則可以用同樣的方式配置重啟即可解決。

vue使用Eslint報錯

初始化Vue時，再刪掉一些不必要的文件和代碼時，因為裝了eslint代碼校驗，有一些朋友同事還安裝了代碼自動格式化的插件，有時候就會出現(xiàn)如下的報錯。

2 problems (2 errors, 0 warnings) 2 errors and 0 warnings potentially fixable with the --fix option.

此時，我們只需要關閉eslint的校驗即可

解決辦法很簡單

① 項目的代碼中找到.eslintrc.js 文件夾將extends中的’@vue/standard’注釋掉

②在rules中添加’space-before-function-paren’: 0

如下圖，修改完成后，關閉項目，重新啟動項目即可解決問題！

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

最新評論