出現(xiàn)的問題：

 在 vue-cli 創(chuàng)建的項目中，創(chuàng)建文件并命名后，會報  “Component name "*****" should always be multi-word”  報錯；

報錯截圖示例如下：

Component name "******" should always be multi-word.eslintvue/multi-word-component-names

報錯的原因：

 在組件命名的時候未按照 ESLint 的官方代碼規(guī)范進行命名，根據(jù) ESLint 官方代碼風格指南，除了根組件（App.vue）以外，其他自定義組件命名要使用大駝峰命名方式或者用“-”連接單詞進行命名；

解決方案： 

方案一 ：重命名(親測有效)

 文件的名稱重命名
 重新命名組件名為駝峰命名方式或者用“-”連接單詞的格式

這樣問題就解決啦~~~~

示例如下：

方案二 ：配置 vue.config.js 文件（網(wǎng)上方法，本人使用無效）

在根目錄下找到 vue.config.js 文件（如果沒有則新建一個，按照示例中的代碼進行添加；用 vue-cli 腳手架進行創(chuàng)建的項目都會有 vue.config.js 文件），添加下面的代碼在 vue.config.js 文件下，加入以下代碼

// 關閉eslint校驗
lintOnSave: false 

示例如下： 

此方案只是編譯時不報錯，如果使用 VScode+eslint 會在文件頭標紅提示，并且官方并不建議直接關閉校驗,因此在這里并不推薦使用該方法進行解決；

配置 vue.config.js 文件的方法（方案二）一般都不能解決問題，不建議大家使用

如果你發(fā)現(xiàn)并沒有解決問題，那么不妨試試其他方案

方案三 ：配置 .eslintrc.js文件（親測有效）

1、關閉命名規(guī)則

找到 .eslintrc.js 文件在 rules 里面加上這么一句

// 關閉名稱校驗
'vue/multi-word-component-names': "off" 

 建議使用這種方法，更加正確合理；

示例如下：

?發(fā)現(xiàn)不報錯了，可以正常運行啦~~~ 

? 以上是關閉命名規(guī)則，將不會校驗組件名，官方建議設置是根據(jù)組件名進行忽略

2、忽略個別組件名

    // 添加組件命名忽略規(guī)則
 
    "vue/multi-word-component-names": ["error",{
       "ignores": ["Home","User"]  //在這個數(shù)組中加入需要忽略的組件名
    }]

推薦使用方案三，極力推薦?。?！

 示例如下：

非常重要的注意點：（重啟項目，配置文件才生效）

在運行的項目中，修改配置文件，必須先將項目在  終端  兩次點擊 Ctrl+C  將項目 終止運行，再 npm run serve 重新運行項目，修改的配置文件才可以生效

這樣，就解決這個報錯啦~~~

總結(jié)

到此這篇關于vue eslint報錯error "Component name "*****" should always be multi-word"解決的文章就介紹到這了,更多相關vue eslint報錯error Component name內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！