vue Eslint校驗(yàn)代碼報(bào)錯(cuò)

在使用腳手架創(chuàng)建Vue項(xiàng)目時(shí)，一般會(huì)安裝Eslint插件，這個(gè)主要是校驗(yàn)代碼格式和規(guī)范用的，但是它很有點(diǎn)讓人抓狂，因?yàn)楹芏嘈ｒ?yàn)規(guī)則和代碼規(guī)范，你只要不按照它的格式來，直接導(dǎo)致項(xiàng)目編譯報(bào)錯(cuò)，運(yùn)行不了項(xiàng)目，這個(gè)是非常令人討厭的。

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

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

1.空格縮進(jìn)，不讓使用tab

具體英語怎么表達(dá)忘記了，看到就知道了。這個(gè)錯(cuò)誤不是一般的讓人煩，簡(jiǎn)直有些讓人無語，誰用誰知道，因?yàn)榇蠖嗔?xí)慣用tab。

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

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

2.未使用的變量報(bào)錯(cuò)

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

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

3.分號(hào)和引號(hào)問題

這個(gè)提示錯(cuò)誤沒法關(guān)掉，Eslint要求字符串使用單引號(hào)，行末不能有多余的分號(hào)，這個(gè)也很煩，與我們常用習(xí)慣相違背。

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

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

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

vue使用Eslint報(bào)錯(cuò)

初始化Vue時(shí)，再刪掉一些不必要的文件和代碼時(shí)，因?yàn)檠b了eslint代碼校驗(yàn)，有一些朋友同事還安裝了代碼自動(dòng)格式化的插件，有時(shí)候就會(huì)出現(xiàn)如下的報(bào)錯(cuò)。

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

此時(shí)，我們只需要關(guān)閉eslint的校驗(yàn)即可

解決辦法很簡(jiǎn)單

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

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

如下圖，修改完成后，關(guān)閉項(xiàng)目，重新啟動(dòng)項(xiàng)目即可解決問題！

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

最新評(píng)論