{
/**
* 支持在模版中使用 eslint-disable-next-line 等注釋
* @category Enabling Correct ESLint Parsing
*/
'vue/comment-directive': 'error',
/**
* 定義了的 jsx element 必須使用
* @category Enabling Correct ESLint Parsing
*/
'vue/jsx-uses-vars': 'error',
/**
* 計算屬性禁止包含異步方法
* @category Error Prevention
*/
'vue/no-async-in-computed-properties': 'error',
/**
* 禁止重復的二級鍵名
* @category Error Prevention
*/
'vue/no-dupe-keys': 'error',
/**
* 禁止出現重復的屬性
* @category Error Prevention
*/
'vue/no-duplicate-attributes': 'error',
/**
* 禁止出現語法錯誤
* @category Error Prevention
*/
'vue/no-parsing-error': 'error',
/**
* 禁止覆蓋保留字
* @category Error Prevention
*/
'vue/no-reserved-keys': 'error',
/**
* 組件的 data 屬性的值必須是一個函數
* @category Error Prevention
*/
'vue/no-shared-component-data': 'error',
/**
* 禁止在計算屬性中對屬性修改
* @category Error Prevention
* @reason 太嚴格了
*/
'vue/no-side-effects-in-computed-properties': 'error',
/**
* 禁止 <template> 使用 key 屬性
* @category Error Prevention
* @reason 太嚴格了
*/
'vue/no-template-key': 'error',
/**
* 禁止在 <textarea> 中出現 {{message}}
* @category Error Prevention
*/
'vue/no-textarea-mustache': 'error',
/**
* 禁止定義在 components 中的組件未使用
* @category Error Prevention
*/
'vue/no-unused-components': 'error',
/**
* 禁止模版中定義的變量未使用
* @category Error Prevention
*/
'vue/no-unused-vars': 'error',
/**
* 禁止在同一個元素上使用 v-if 和 v-for 指令
* @category Error Prevention
*/
'vue/no-use-v-if-with-v-for': 'error',
/**
* <component> 必須有 v-bind:is
* @category Error Prevention
*/
'vue/require-component-is': 'error',
/**
* props 的取值必須是構造函數
* @category Error Prevention
* @fixable
*/
'vue/require-prop-type-constructor': 'error',
/**
* render 函數必須有返回值
* @category Error Prevention
*/
'vue/require-render-return': 'error',
/**
* v-for 指令的元素必須有 v-bind:key
* @category Error Prevention
*/
'vue/require-v-for-key': 'error',
/**
* prop 的默認值必須匹配它的類型
* @category Error Prevention
* @reason 太嚴格了
*/
'vue/require-valid-default-prop': 'error',
/**
* 計算屬性必須有返回值
* @category Error Prevention
*/
'vue/return-in-computed-property': 'error',
/**
* 當一個節點上出現兩個 v-on:click 時,其中一個必須為 exact
* @category Error Prevention
*/
'vue/use-v-on-exact': 'error',
/**
* template 的根節點必須合法
* @category Error Prevention
*/
'vue/valid-template-root': 'error',
/**
* v-bind 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-bind': 'error',
/**
* v-cloak 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-cloak': 'error',
/**
* v-else 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-else': 'error',
/**
* v-else-if 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-else-if': 'error',
/**
* v-for 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-for': 'error',
/**
* v-html 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-html': 'error',
/**
* v-if 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-if': 'error',
/**
* v-model 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-model': 'error',
/**
* v-on 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-on': 'error',
/**
* v-once 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-once': 'error',
/**
* v-pre 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-pre': 'error',
/**
* v-show 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-show': 'error',
/**
* v-text 指令必須合法
* @category Error Prevention
*/
'vue/valid-v-text': 'error',
/**
* 限制自定義組件的屬性風格
* @category Improving Readability
* @reason 沒必要限制
* @fixable
*/
'vue/attribute-hyphenation': 'off',
/**
* 模版中開始標簽的反尖括號必須換行
* @category Improving Readability
* @fixable
*/
'vue/html-closing-bracket-newline': 'error',
/**
* 模版中開始標簽的反尖括號前禁止有空格,自閉和標簽前必須有空格
* @category Improving Readability
* @fixable
*/
'vue/html-closing-bracket-spacing': 'error',
/**
* html 的結束標簽必須符合規定
* @category Improving Readability
* @reason 有的標簽不必嚴格符合規定,如 <br> 或 <br/> 都應該是合法的
* @fixable
*/
'vue/html-end-tags': 'error',
/**
* 模版中使用 4 個空格縮進
* @category Improving Readability
* @fixable
*/
'vue/html-indent': ['error', 4],
/**
* html 屬性值必須用雙引號括起來
* @category Improving Readability
*/
'vue/html-quotes': 'error',
/**
* 沒有內容時,組件必須自閉和
* @category Improving Readability
* @fixable
*/
'vue/html-self-closing': 'error',
/**
* 限制每行允許的最多屬性數量
* @category Improving Readability
*/
'vue/max-attributes-per-line': ["error", {
"singleline": 1,
"multiline": {
"max": 1,
"allowFirstLine": false
}
}],
/**
* 多行內容或多行標簽時,內容前必須換行
* @category Improving Readability
* @fixable
*/
'vue/multiline-html-element-content-newline': 'error',
/**
* 模版內 mustache 大括號內前后禁止有空格
* @category Improving Readability
* @fixable
*/
'vue/mustache-interpolation-spacing': ['error', 'never'],
/**
* 限制組件的 name 屬性的值的風格
* @category Improving Readability
* @reason 沒必要限制
* @fixable
*/
'vue/name-property-casing': ["error", "PascalCase"],
/**
* 禁止出現連續空格
* @category Improving Readability
* @fixable
*/
'vue/no-multi-spaces': 'error',
/**
* 屬性的等號前后禁止有空格
* @category Improving Readability
* @fixable
*/
'vue/no-spaces-around-equal-signs-in-attribute': 'error',
/**
* 模版中的變量名禁止與前一個作用域重名
* @category Improving Readability
*/
'vue/no-template-shadow': 'off',
/**
* props 必須用駝峰式
* @category Improving Readability
* @fixable
*/
'vue/prop-name-casing': 'off',
/**
* props 如果不是 required 的字段,必須有默認值
* @category Improving Readability
*/
'vue/require-default-prop': 'error',
/**
* prop 必須有類型限制
* @category Improving Readability
*/
'vue/require-prop-types': 'error',
/**
* 單行標簽內容必須換行
* @category Improving Readability
* @fixable
*/
'vue/singleline-html-element-content-newline': 'error',
/**
* 限制 v-bind 的風格
* @category Improving Readability
* @fixable
*/
'vue/v-bind-style': 'error',
/**
* 限制 v-on 的風格
* @category Improving Readability
* @fixable
*/
'vue/v-on-style': 'error',
/**
* 標簽屬性必須按規則排序
* @category Minimizing Arbitrary Choices and Cognitive Overhead
* @fixable
*/
'vue/attributes-order': 'error',
/**
* 禁用 v-html
* @category Minimizing Arbitrary Choices and Cognitive Overhead
*/
'vue/no-v-html': 'error',
/**
* 組件的屬性必須為一定的順序
* @category Minimizing Arbitrary Choices and Cognitive Overhead
*/
'vue/order-in-components': 'error',
/**
* 禁止在模版中用 this
* @category Minimizing Arbitrary Choices and Cognitive Overhead
*/
'vue/this-in-template': 'error',
/**
* 數組的括號內的前后禁止有空格
* @category Uncategorized
* @fixable
*/
'vue/array-bracket-spacing': ['error', 'never'],
/**
* 箭頭函數的箭頭前后必須有空格
* @category Uncategorized
* @fixable
*/
'vue/arrow-spacing': [
'error',
{
before: true,
after: true
}
],
/**
* 代碼塊如果在一行內,那么大括號內的首尾必須有空格
* @category Uncategorized
* @fixable
*/
'vue/block-spacing': ['error', 'always'],
/**
* if 與 else 的大括號風格必須一致
* @category Uncategorized
* @reason else 代碼塊可能前面需要有一行注釋
* @fixable
*/
'vue/brace-style': 'off',
/**
* 變量名必須是 camelcase 風格的
* @category Uncategorized
* @reason 很多 api 或文件名都不是 camelcase
*/
'vue/camelcase': 'off',
/**
* 對象的最后一個屬性末尾必須有逗號
* @category Uncategorized
* @fixable
*/
'vue/comma-dangle': 'off',
/**
* 約束自定義標簽的命名規則
* @category Uncategorized
* @fixable
*/
'vue/component-name-in-template-casing': 'off',
/**
* 必須使用 === 或 !==,禁止使用 == 或 !=,與 null 比較時除外
* @category Uncategorized
* @fixable
*/
'vue/eqeqeq': [
'error',
'always',
{
null: 'ignore'
}
],
/**
* 對象字面量中冒號前面禁止有空格,后面必須有空格
* @category Uncategorized
* @fixable
*/
'vue/key-spacing': [
'error',
{
beforeColon: false,
afterColon: true,
mode: 'strict'
}
],
/**
* 組件名稱必須和文件名一致
* @category Uncategorized
*/
'vue/match-component-file-name': 'off',
/**
* 禁止給布爾值 props 添加默認值
* @category Uncategorized
* @fixable
*/
'vue/no-boolean-default': 'off',
/**
* 禁止使用特定的語法
* @category Uncategorized
* @reason 它用于限制某個具體的語法不能使用
*/
'vue/no-restricted-syntax': 'off',
/**
* 對象字面量只有一行時,大括號內的首尾必須有空格
* @category Uncategorized
* @fixable
*/
'vue/object-curly-spacing': [
'error',
'always',
{
arraysInObjects: true,
objectsInObjects: false
}
],
/**
* 禁止手動 export default
* @category Uncategorized
*/
'vue/require-direct-export': 'error',
/**
* 一個縮進必須用四個空格替代
* @category Uncategorized
*/
'vue/script-indent': [
'error',
4,
{
switchCase: 1
}
],
/**
* 操作符左右必須有空格
* @category Uncategorized
* @fixable
*/
'vue/space-infix-ops': 'error',
/**
* new, typeof 等后面必須有空格,++, -- 等禁止有空格
* @category Uncategorized
* @fixable
*/
'vue/space-unary-ops': [
'error',
{
words: true,
nonwords: false
}
],
/**
* 禁止在 v-on 的值中調用函數
* @category Uncategorized
* @fixable
*/
'vue/v-on-function-call': 'error'
}
ESlint Vue Plugin Rules
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
推薦閱讀更多精彩內容
- 上一篇博文介紹了eslint 安裝: http://www.lxweimin.com/p/cfe2d8d41e00 ...
- 遇到這個問題,不要慌,在.eslinkrc.js文件的rules中配置‘indent’:0
- 1. 什么是ESlint? ESLint 是一個ECMAScript/JavaScript 語法規則和代碼風格的檢...
- 這個意思是說在new Vue必須賦值給某個值的,強制不讓eslink抱著個錯的話,只需要在new Vue實例化之前...
- React specific linting rules for ESLint用于React的ESLint規則 I...