vue的空格報錯如何解決

本篇內(nèi)容介紹了“vue的空格報錯如何解決”的有關(guān)知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領(lǐng)大家學(xué)習(xí)一下如何處理這些情況吧！希望大家仔細(xì)閱讀，能夠?qū)W有所成！

vue空格報錯的解決辦法：1、找到目錄build下的webpack.base.conf.js文件，把其中的rules注銷掉；2、重新執(zhí)行“npm run dev”；3、打開test目錄下的.eslintrc.js文件，添加自定義規(guī)則；4、打開rules，手動添加“no-mixed-spaces-and-tabs”，然后定義為0，關(guān)閉規(guī)則即可。

vue空格報錯

搭建了一個vue項目，在配置路有的時候，陸續(xù)出現(xiàn)了各種報錯其中最多的是一些寫法，例如空格，縮進(jìn)，各種括號，結(jié)果我一句一句對照，修改相當(dāng)之費(fèi)時間，效率低，一上午，一個路由配置都沒寫好

主要報錯如下：

截取了一段常見報錯，選取其中一個：

Expected indentation of 4 spaces but found 1 tab

翻譯一下，意思是：預(yù)期縮進(jìn)4個空格，但找到1個選項卡。意思是vue在檢測寫法規(guī)則的時候，只認(rèn)空格，不認(rèn)tab的縮進(jìn)，這時你就要修改的頁面內(nèi)容，把tab換成空格，這樣就比較麻煩，然鵝各種查找原因，找到了解決方案，如下：

一，找到目錄build下的webpack.base.conf.js文件，把其中的rules里的這一段注銷掉：

保存，然后重新npm run dev 一下：

報錯雖然不見了，但是這樣做的弊端是，強(qiáng)行停止一切檢錯功能，很多語法錯誤檢測不出，在初期，是不建議這么做的，更加不利于代碼的可讀行以及規(guī)范性。那么就要尋找另一個辦法，只是更改一下規(guī)則里的配置。

二，這就用到了另一個配置文件：test目錄下的.eslintrc.js文件（推薦）

添加你的自定義規(guī)則，然后推薦大家熟悉一下ESLint 規(guī)則

規(guī)則

在配置文件中可以設(shè)置一些規(guī)則。

規(guī)則的錯誤等級有三種：

“off” 或者 0：關(guān)閉規(guī)則。
“warn” 或者 1：打開規(guī)則，并且作為一個警告（不影響exit code）。
“error” 或者 2：打開規(guī)則，并且作為一個錯誤（exit code將會是1）。

為了讓你對規(guī)則有個更好的理解，ESLint 對其進(jìn)行了分門別類。

所有的規(guī)則默認(rèn)都是禁用的。在配置文件中，使用 “extends”: “eslint:recommended” 來啟用推薦的規(guī)則，報告一些常見的問題，在下文中這些推薦的規(guī)則都帶有一個標(biāo)記。

Possible Errors對照著來自定義規(guī)則配置

以上面提到的報錯為例，是跟空格縮進(jìn)有關(guān)，找到相關(guān)規(guī)則提示：

然后到rules里，手動添加’no-mixed-spaces-and-tabs’，然后定義為0，關(guān)閉規(guī)則

// 在這里添加自定義規(guī)則
'rules': {
// allow paren-less arrow functions
'arrow-parens': 0,
// allow async-await
'generator-star-spacing': 0,
// 禁止空格和 tab 的混合縮進(jìn)
'no-mixed-spaces-and-tabs'：0，
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
}

好了，保存刷新，你會發(fā)現(xiàn)報錯不再提示，這樣做的好處是，挑選需要忽略的規(guī)則

為什么要使用Vue

Vue是一款友好的、多用途且高性能的JavaScript框架，使用vue可以創(chuàng)建可維護(hù)性和可測試性更強(qiáng)的代碼庫，Vue允許可以將一個網(wǎng)頁分割成可復(fù)用的組件，每個組件都包含屬于自己的HTML、CSS、JavaScript，以用來渲染網(wǎng)頁中相應(yīng)的地方，所以越來越多的前端開發(fā)者使用vue。

“vue的空格報錯如何解決”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識可以關(guān)注億速云網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實用文章！