最近在項目打包時,出現如下一些錯誤:


這些錯誤本可以避免的,前面把編輯器卸載重裝忘記設置了,真是自己坑了自己 o(╥﹏╥)o
-
"off" or 0:停用這個規則
-
"warn" or 1:啟用規則,當不滿足規則時發出警告,不會導致程序退出
-
"error" or 2:啟用規則,當不滿足規則時報錯,會導致程序退出
1. 'Expected indentation of 2 spaces but found 4' 期望縮進兩個空格,但找到4個空格。eslint默認是不認可tab的,習慣了用tab鍵來打空格,就會出現這個問題。在eslint的配置文件.eslintrc.js中做如下配置:
module.exports = { rules: { ... ... 'no-tabs': 'off' //停用tab縮進 } }
也可以對編輯器的縮進進行設置,我用的是vscode,打開管理 -> 設置 -> 搜索 tab size 然后修改保存

注意:eslint配置文件修改了一定要重新手動編譯運行。
2. 'Trailing spaces not allowed' 這個是行尾有多余的空格,刪除就可以了
3. ''XXX' is assigned a value but never used' 聲明的變量沒有使用
4. 'String must use singlequote' 把雙引號改成單引號就行了
5. 'Extra semicolon' 行尾多了分號,(默認的eslint配置是不使用分號的)
6. 'Unexpected trailing comma' 行尾多了一個逗號
7. 'Unexpected template string expression' 使用了不必要的模板字符串表達式
8. '"XXX" is never reassigned. Use 'const'' 使用let聲明的變量,之后沒有重新分配,使用const代替
9. 'Expected space(s) after "if"'
'Missing space before function parentheses'
'Missing space before opening brace'
'Expected space or tab after '//' in comment' 這幾個都是缺少空格
10. 'Unexpected side effect in "submitParams" computed property' 這個出錯是因為我在計算屬性中對其他屬性值做了賦值操作,換成watch就好了,應該是計算屬性僅做單純的運算,不好直接變更屬性值
11. 'Identifier 'col_names' is not in camel case' 沒有使用駝峰方式命名
12. 'Unnecessary use of conditional expression for default assignment' 這個是因為對某個值的初始化使用了三元表達式
13. 'Closing curly brace does not appear on the same line as the subsequent block' 大括號與后續代碼塊不在同一行上,比如if ... else ... 語句,else語句換行了
以上這些問題我們可以選擇手動修復,也可以通過配置啟動eslint進行自動錯誤修復的功能。打開vscode管理 -> 設置 -> 搜索 eslint 然后勾選

如果提示這種設置不推薦,可以通過管理 -> 設置,然后在setting.json中使用 editor.codeActionsOnSave代替:

這樣自動修復功能就打開了,可以打開錯誤頁面,執行保存操作,就不用一個一個手動去改了。
附部分規則配置說明:
"no-alert": 0, //禁止使用alert confirm prompt
"no-console": 2, //禁止使用console
"no-debugger": 2, //禁止使用debugger
"for-direction": 2, //禁止for無限循環
"no-multi-spaces": 1, //不能有多余的空格
"no-var": 0, //禁用var,用let和const代替
"no-redeclare": 2, //禁止重復聲明變量
"camelcase": 2, //要求駝峰法命名
"no-dupe-args": 2, //禁止在函數或表達中出現重名參數
"no-extra-semi": 2, //禁止不必要的分號
"require-await": 2, //禁止使用不帶 await 表達式的 async 函數
像console和debugger都是在生產環境比較常用的,其他還有很多官網都有詳細說明,大家可自行查閱。
