1.1.11 • Published 5 months ago

eslint-config-zm-vue v1.1.11

Weekly downloads
-
License
ISC
Repository
-
Last release
5 months ago

前端 eslint 规范

如何使用

安装

npm i -D  eslint eslint-plugin-import eslint-plugin-vue vue-eslint-parser eslint-config-zm-vue

使用

extends: ['eslint-config-zm-vue/vue']

常见问题

  • 事例 1
var show =()=> {
console.log("hello word");
};

会有如下错误

warning: Unexpected var, use let or const instead (no-var) at src/eslint-demo/eslint-js.js:1:1:
> 1 | var show =()=> {
| ^
2 |   console.log("hello word");
3 | };
4 |


error: 'show' is assigned a value but never used (no-unused-vars) at src/eslint-demo/eslint-js.js:1:5:
> 1 | var show =()=> {
|     ^
2 |   console.log("hello word");
3 | };
4 |


error: Operator '=' must be spaced (space-infix-ops) at src/eslint-demo/eslint-js.js:1:10:
> 1 | var show =()=> {
|          ^
2 |   console.log("hello word");
3 | };
4 |


error: Missing space before => (arrow-spacing) at src/eslint-demo/eslint-js.js:1:12:
> 1 | var show =()=> {
|            ^
2 |   console.log("hello word");
3 | };
4 |

应该写成

// 注意: console.log 和 debugger 在项目中也会给出警告,调试完成后及时删除哦!
const show = () => {
console.log("hello word");
};

show();
  • 事例 2
let arr = [1,2,3,4,5];
arr = ['abc','def','mes'];
console.log(arr);

会有如下错误

error: A space is required after ',' (comma-spacing) at src/eslint-demo/eslint-js.js:7:19:
6 |
>  7 | let arr = [1,2,3,4,5];
|                   ^
8 | arr = ['abc','def','msg'];
9 | console.log(arr);
10 |


error: A space is required after ',' (comma-spacing) at src/eslint-demo/eslint-js.js:8:13:
6 |
7 | let arr = [1,2,3,4,5];
>  8 | arr = ['abc','def','msg'];
|             ^
9 | console.log(arr);
10 |

应该写成

// 只有当引用类型的值被重新赋值的时候用 let,否则一律用 const
let arr = [1, 2, 3, 4, 5];
arr = ['abc', 'def', 'msg'];
console.log(arr);
  • 事例 3
const myArr = [1, 2, 3, 4];
const tep = false;
const show = () => {
console.log(flag);
if(tep){
var flag = 'say hi';
return;
}else{
const newArr = myArr.map(item => item + 1);
console.log(newArr);
return newArr;
}
};

show();

错误提示

Module Warning (from ./node_modules/eslint-loader/index.js):
error: 'flag' was used before it was defined (no-use-before-define) at src/eslint-demo/eslint-js.js:4:15:
2 | const tep = false;
3 | const show = () => {
> 4 |   console.log(flag);
|               ^
5 |   if(tep){
6 |     var flag = 'say hi';
7 |     return;


error: 'flag' used outside of binding context (block-scoped-var) at src/eslint-demo/eslint-js.js:4:15:
2 | const tep = false;
3 | const show = () => {
> 4 |   console.log(flag);
|               ^
5 |   if(tep){
6 |     var flag = 'say hi';
7 |     return;


warning: Expected space(s) after "if" (keyword-spacing) at src/eslint-demo/eslint-js.js:5:3:
3 | const show = () => {
4 |   console.log(flag);
> 5 |   if(tep){
|   ^
6 |     var flag = 'say hi';
7 |     return;
8 |   }else{


warning: Unexpected var, use let or const instead (no-var) at src/eslint-demo/eslint-js.js:6:5:
4 |   console.log(flag);
5 |   if(tep){
> 6 |     var flag = 'say hi';
|     ^
7 |     return;
8 |   }else{
9 |     const newArr = myArr.map(item => item + 1);


error: Unnecessary return statement (no-useless-return) at src/eslint-demo/eslint-js.js:7:5:
5 |   if(tep){
6 |     var flag = 'say hi';
>  7 |     return;
|     ^
8 |   }else{
9 |     const newArr = myArr.map(item => item + 1);
10 |     console.log(newArr);


warning: Expected space(s) before "else" (keyword-spacing) at src/eslint-demo/eslint-js.js:8:4:
6 |     var flag = 'say hi';
7 |     return;
>  8 |   }else{
|    ^
9 |     const newArr = myArr.map(item => item + 1);
10 |     console.log(newArr);
11 |     return newArr;


warning: Expected space(s) after "else" (keyword-spacing) at src/eslint-demo/eslint-js.js:8:4:
6 |     var flag = 'say hi';
7 |     return;
>  8 |   }else{
|    ^
9 |     const newArr = myArr.map(item => item + 1);
10 |     console.log(newArr);
11 |     return newArr;


error: Arrow function expected no return value (consistent-return) at src/eslint-demo/eslint-js.js:11:5:
9 |     const newArr = myArr.map(item => item + 1);
10 |     console.log(newArr);
> 11 |     return newArr;
|     ^
12 |   }
13 | };
14 |

应该写成

/*
注意点:
1, if 、else 前端后有空格
2, return 后面要接数据,没有数据写个 null;
3, 不能在代码块中定义变量,在块外部引用。
4, 变量在函数内部定义;

*/

const show = () => {
const myArr = [1, 2, 3, 4];
const flag = 'say hhi';
const tep = false;
if (tep) {
console.log(flag);
return null;
}
const newArr = myArr.map(item => item + 1);
console.log(newArr);
return newArr;
};

show();
  • 事例 4
function todo(name,age) {
  const obj = {
    name: 'zhangsan',
    age: 19,
    name: 'lisi',
  };
  const books = [, , 'dom 编程艺术', '你不知道的javascript'];
  switch (name){
    case 'zhangsan':
      console.log('study js');
      break;
    case 'lisi':
      return age;
  }

  try {
    const reslut = 100 / 0;
    console.log(reslut);
  } catch (e) {
    throw e;
  } finally {
    console.log(books);
    return obj;
  }
};

todo('zhangsan', 18);

错误提示

Module Warning (from ./node_modules/eslint-loader/index.js):
error: A space is required after ',' (comma-spacing) at src/eslint-demo/eslint-js.js:1:19:
> 1 | function todo(name,age) {
    |                   ^
  2 |   const obj = {
  3 |     name: 'zhangsan',
  4 |     age: 19,


error: Duplicate key 'name' (no-dupe-keys) at src/eslint-demo/eslint-js.js:5:5:
  3 |     name: 'zhangsan',
  4 |     age: 19,
> 5 |     name: 'lisi',
    |     ^
  6 |   };
  7 |   const books = [, , 'dom 编程艺术', '你不知道的javascript'];
  8 |   switch (name){


error: Unexpected comma in middle of array (no-sparse-arrays) at src/eslint-demo/eslint-js.js:7:17:
   5 |     name: 'lisi',
   6 |   };
>  7 |   const books = [, , 'dom 编程艺术', '你不知道的javascript'];
     |                 ^
   8 |   switch (name){
   9 |     case 'zhangsan':
  10 |       console.log('study js');


warning: Expected a default case (default-case) at src/eslint-demo/eslint-js.js:8:3:
   6 |   };
   7 |   const books = [, , 'dom 编程艺术', '你不知道的javascript'];
>  8 |   switch (name){
     |   ^
   9 |     case 'zhangsan':
  10 |       console.log('study js');
  11 |       break;


error: Unsafe usage of ReturnStatement (no-unsafe-finally) at src/eslint-demo/eslint-js.js:23:5:
  21 |   } finally {
  22 |     console.log(books);
> 23 |     return obj;
     |     ^
  24 |   }
  25 | };
  26 |


error: Unnecessary semicolon (no-extra-semi) at src/eslint-demo/eslint-js.js:25:2:
  23 |     return obj;
  24 |   }
> 25 | };
     |  ^
  26 |
  27 | todo('zhangsan', 18);
  28 |

应该写成

/*

1,json 对象内的key 不能有重复
2,函数有多个形参时,逗号后面有分号
3,定义数组时每项key都要有值
4,swatch 内要有 default
5, finally 代码块内不能有 return
6, 定义 function 函数后面不能有多余有 分号;
7, 此函数是有 return 的,最后一定是有返回值的

*/

function todo(name, age) {
  const obj = {
    name: 'zhangsan',
    age: 19,
  };
  const books = ['dom 编程艺术', '你不知道的javascript'];
  switch (name){
    case 'zhangsan':
      console.log('study js');
      break;
    case 'lisi':
      return age;
    default:
      break;
  }

  try {
    const reslut = 100 / 0;
    console.log(reslut);
    return null;
  } catch (e) {
    throw e;
  } finally {
    console.log(books);
    console.log(obj);
  }
}

todo('zhangsan', 18);

// 建议 函数 如下字义最好

const todo = (name, age) => {
  const obj = {
    name: 'zhangsan',
    age: 19,
  };
  const books = ['dom 编程艺术', '你不知道的javascript'];
  switch (name){
    case 'zhangsan':
      console.log('study js');
      break;
    case 'lisi':
      return age;
    default:
      break;
  }

  try {
    const reslut = 100 / 0;
    console.log(reslut);
    return null;
  } catch (e) {
    throw e;
  } finally {
    console.log(books);
    console.log(obj);
  }
};

todo('zhangsan', 18);
  • 事例 5
const show = (who, flag) => {
  const arr = new Array(1, 2, 3, 4),
        isYes = flag === 1 ? true : false;
  let sum = 0;
  if (isYes) {
    for(let i=0,len=arr.length;i<len;i++){
      sum+=arr[i];
    }
    console.log(who, sum);
  }
  console.log('hi ', who, 'no message');
};



show('zhangsan', 18);

错误提示

error: Split 'const' declarations into multiple statements (one-var) at src/eslint-demo/eslint-js.js:2:3:
  1 | const show = (who, flag) => {
> 2 |   const arr = new Array(1, 2, 3, 4),
    |   ^
  3 |         isYes = flag === 1 ? true : false;
  4 |   let sum = 0;
  5 |   if (isYes) {


error: The array literal notation [] is preferable (no-array-constructor) at src/eslint-demo/eslint-js.js:2:15:
  1 | const show = (who, flag) => {
> 2 |   const arr = new Array(1, 2, 3, 4),
    |               ^
  3 |         isYes = flag === 1 ? true : false;
  4 |   let sum = 0;
  5 |   if (isYes) {


error: Expected indentation of 4 spaces but found 8 (indent) at src/eslint-demo/eslint-js.js:3:1:
  1 | const show = (who, flag) => {
  2 |   const arr = new Array(1, 2, 3, 4),
> 3 |         isYes = flag === 1 ? true : false;
    | ^
  4 |   let sum = 0;
  5 |   if (isYes) {
  6 |     for(let i=0,len=arr.length;i<len;i++){


error: Unnecessary use of boolean literals in conditional expression (no-unneeded-ternary) at src/eslint-demo/eslint-js.js:3:30:
  1 | const show = (who, flag) => {
  2 |   const arr = new Array(1, 2, 3, 4),
> 3 |         isYes = flag === 1 ? true : false;
    |                              ^
  4 |   let sum = 0;
  5 |   if (isYes) {
  6 |     for(let i=0,len=arr.length;i<len;i++){


warning: Expected space(s) after "for" (keyword-spacing) at src/eslint-demo/eslint-js.js:6:5:
  4 |   let sum = 0;
  5 |   if (isYes) {
> 6 |     for(let i=0,len=arr.length;i<len;i++){
    |     ^
  7 |       sum+=arr[i];
  8 |     }
  9 |     console.log(who, sum);


error: Operator '=' must be spaced (space-infix-ops) at src/eslint-demo/eslint-js.js:6:14:
  4 |   let sum = 0;
  5 |   if (isYes) {
> 6 |     for(let i=0,len=arr.length;i<len;i++){
    |              ^
  7 |       sum+=arr[i];
  8 |     }
  9 |     console.log(who, sum);


error: A space is required after ',' (comma-spacing) at src/eslint-demo/eslint-js.js:6:16:
  4 |   let sum = 0;
  5 |   if (isYes) {
> 6 |     for(let i=0,len=arr.length;i<len;i++){
    |                ^
  7 |       sum+=arr[i];
  8 |     }
  9 |     console.log(who, sum);


error: Operator '=' must be spaced (space-infix-ops) at src/eslint-demo/eslint-js.js:6:20:
  4 |   let sum = 0;
  5 |   if (isYes) {
> 6 |     for(let i=0,len=arr.length;i<len;i++){
    |                    ^
  7 |       sum+=arr[i];
  8 |     }
  9 |     console.log(who, sum);


warning: Missing whitespace after semicolon (semi-spacing) at src/eslint-demo/eslint-js.js:6:31:
  4 |   let sum = 0;
  5 |   if (isYes) {
> 6 |     for(let i=0,len=arr.length;i<len;i++){
    |                               ^
  7 |       sum+=arr[i];
  8 |     }
  9 |     console.log(who, sum);


error: Operator '<' must be spaced (space-infix-ops) at src/eslint-demo/eslint-js.js:6:33:
  4 |   let sum = 0;
  5 |   if (isYes) {
> 6 |     for(let i=0,len=arr.length;i<len;i++){
    |                                 ^
  7 |       sum+=arr[i];
  8 |     }
  9 |     console.log(who, sum);


warning: Missing whitespace after semicolon (semi-spacing) at src/eslint-demo/eslint-js.js:6:37:
  4 |   let sum = 0;
  5 |   if (isYes) {
> 6 |     for(let i=0,len=arr.length;i<len;i++){
    |                                     ^
  7 |       sum+=arr[i];
  8 |     }
  9 |     console.log(who, sum);


error: Operator '+=' must be spaced (space-infix-ops) at src/eslint-demo/eslint-js.js:7:10:
   5 |   if (isYes) {
   6 |     for(let i=0,len=arr.length;i<len;i++){
>  7 |       sum+=arr[i];
     |          ^
   8 |     }
   9 |     console.log(who, sum);
  10 |   }


error: More than 2 blank lines not allowed (no-multiple-empty-lines) at src/eslint-demo/eslint-js.js:13:1:
  11 |   console.log('hi ', who, 'no message');
  12 | };
> 13 |
     | ^
  14 |
  15 |
  16 | show('zhangsan', 18);

应该写成

/*
1, 定义变量时不能一行定义,只为了方便维护
2, 定义数组请用 [] , 不能用 Array 来创建函数。
3, 避免没有用的三元运算
4, 逗号后面有空格
5, 空行不能太多
6, 中缀操作符周围有空格 (+ - * / % < > = += ......)
*/

const show = (who, flag) => {
  const arr = [1, 2, 3, 4];
  const isYes = flag === 1;
  let sum = 0;
  if (isYes) {
    for (let i = 0, len = arr.length; i < len; i++){
      sum += arr[i];
    }
    console.log(who, sum);
  }
  console.log('hi ', who, 'no message');
};

show('zhangsan', 18);
  • 案例 6
<template>
  <div id="app">
    <textarea>{{mesg}}</textarea>
    <ul>
      <li v-for="item in arr">{{item}}</li>
    </ul>
    <button v-on:click="testClick">点击1</button>
    <button v-on:click.aaa="testClick2">点击2</button>
    <router-view />
  </div>
</template>
<script>
export default {
  name: 'App',
  data() {
    return {
      msg: 'hello word',
      arr: [1, 2, 3, 4],
      $el: 'root',
    };
  },
  computed: {
    getSum() {
      this.arr.reduce((bef, after) => bef + after);
    },
  },
  methods: {
    testClick() {
      alert('hi');
    },
    testClick2() {
      alert('你好');
    },
  },
};
</script>

错误提示

error: Unexpected mustache. Use 'v-model' instead (vue/no-textarea-mustache) at src/App.vue:3:15:
  1 | <template>
  2 |   <div id="app">
> 3 |     <textarea>{{mesg}}</textarea>
    |               ^
  4 |     <ul>
  5 |       <li v-for="item in arr">{{item}}</li>
  6 |     </ul>


error: Elements in iteration expect to have 'v-bind:key' directives (vue/require-v-for-key) at src/App.vue:5:7:
  3 |     <textarea>{{mesg}}</textarea>
  4 |     <ul>
> 5 |       <li v-for="item in arr">{{item}}</li>
    |       ^
  6 |     </ul>
  7 |     <button v-on:click="testClick">点击1</button>
  8 |     <button v-on:click.aaa="testClick2">点击2</button>


error: 'v-on' directives don't support the modifier 'aaa' (vue/valid-v-on) at src/App.vue:8:13:
   6 |     </ul>
   7 |     <button v-on:click="testClick">点击1</button>
>  8 |     <button v-on:click.aaa="testClick2">点击2</button>
     |             ^
   9 |     <router-view />
  10 |   </div>
  11 | </template>


error: Key '$el' is reserved (vue/no-reserved-keys) at src/App.vue:19:7:
  17 |       msg: 'hello word',
  18 |       arr: [1, 2, 3, 4],
> 19 |       $el: 'root',
     |       ^
  20 |     };
  21 |   },
  22 |   computed: {


error: Expected to return a value in "getSum" computed property (vue/return-in-computed-property) at src/App.vue:23:11:
  21 |   },
  22 |   computed: {
> 23 |     getSum() {
     |           ^
  24 |       this.arr.reduce((bef, after) => bef + after);
  25 |     },
  26 |   },


warning: Unexpected alert (no-alert) at src/App.vue:29:7:
  27 |   methods: {
  28 |     testClick() {
> 29 |       alert('hi');
     |       ^
  30 |     },
  31 |     testClick2() {
  32 |       alert('你好');


warning: Unexpected alert (no-alert) at src/App.vue:32:7:
  30 |     },
  31 |     testClick2() {
> 32 |       alert('你好');
     |       ^
  33 |     },
  34 |   },
  35 | };

应该写成

/*
1, textarea 中用 v-mode
2, v-for 一定要加 key
3, 注意指令的应用
4, 不能声明vue内置的变量
5, computed 一定要有返回值
*/

<template>
  <div id="app">
    <textarea v-mode="msg"></textarea>
    <ul>
      <li v-for="item in arr" :key="item">{{item}}</li>
    </ul>
    <button @click="testClick">点击1</button>
    <button @click.stop="testClick2">点击2</button>
    <router-view />
  </div>
</template>
<script>
export default {
  name: 'App',
  data() {
    return {
      msg: 'hello word',
      arr: [1, 2, 3, 4],
      el: 'root',
    };
  },
  computed: {
    getSum() {
      return this.arr.reduce((bef, after) => bef + after);
    },
  },
  methods: {
    testClick() {
      console.log('hi');
    },
    testClick2() {
      console.log('你好');
    },
  },
};
</script>
  • 注意文件大小 1 文件最大 1200 行代码,如果超过,请另创建文件 2 函数最大行数是 400 行,超过会给出警告 3 单行最大字符数是 120,超过会给出警告

开启的规则

es6 开启的规则

// 箭头函数的箭头前后各留一个空格
'arrow-spacing': ['error', { before: true, after: true }]

// 子类的 construtor 中必须使用 super,非子类的 construtor 中不能使用 super
'constructor-super': 'error'

// 禁止对类声明变量重新赋值
'no-class-assign': 'error',

// 避免箭头函数与比较操作符产生混淆
// 正确事例如下
//  var x = a => (1 ? 2 : 3);
// var x = (a) => (1 ? 2 : 3);
// var x = a => { return 1 ? 2 : 3; };
// var x = (a) => { return 1 ? 2 : 3; };
'no-confusing-arrow': ['error',{allowParens: true}]

// 禁止修改 const 声明的变量
'no-const-assign': 'error',

// 避免重复的类成员命名
'no-dupe-class-members': 'error',

// 在 constructor 中,禁止在调用 super() 前使用 this 或 super 关键字
'no-this-before-super': 'error',

// 对象的属性名不要使用无必要的计算属性
'no-useless-computed-key': 'error',

// 避免不必要的 construtor
'no-useless-constructor': 'error',

// 禁止在解构/import/export时进行无用的重命名
'no-useless-rename': ['error',{ignoreDestructuring: false,ignoreImport: false,ignoreExport: false}]

// 使用 const 或 let 声明变量,不要使用 var
'no-var': 'warn',

// 使用对象属性和方法的简写语法
'object-shorthand': ['error','always',{ignoreConstructors: false,avoidQuotes: true}],

// 回调函数使用箭头函数而不是匿名函数
'prefer-arrow-callback': ['error',{allowNamedFunctions: false,allowUnboundThis: true}],

// 优先使用 const,只有当变量会被重新赋值时才使用 let
'prefer-const': ['error',{destructuring: 'any',ignoreReadBeforeAssign: true}],

// 剩余和扩展操作符与操作对象间不应有空格
'rest-spread-spacing': ['error', 'never']

最佳实践

// 某些数组方法的回调函数中必须包含 return 语句
'array-callback-return': ['error', { allowImplicit: true }],

// 把 var 语句看作是在块级作用域范围之内,不能在块外使用
'block-scoped-var': 'error',

// 要求 return 语句要么总是指定返回的值,要么不指定
'consistent-return': 'off',

// 多行语句必须用大括号包裹,单行语句推荐用大括号包裹
curly: ['error', 'multi-line'],

// switch 语句需要始终包含 default 分支
'default-case': ['warn', { commentPattern: '^no default$' }],

// 统一在点号之前换行
'dot-location': ['error', 'property'],

// 禁止使用 arguments.caller 和 arguments.callee
'no-caller': 'error',

// 不要在解构中出现空模式,即 {} 或 []
'no-empty-pattern': 'error',

// 禁止使用 eval
'no-eval': 'warn',

// 禁止扩展原生对象
'no-extend-native': 'error',

// 禁止不必要的 label
'no-extra-label': 'error',

// 不要让 case 语句落空
'no-fallthrough': 'error',

// 不要省略小数点前或小数点后的 0
'no-floating-decimal': 'error',

// 禁止对原生对象或只读的全局对象进行赋值
'no-global-assign': ['error', { exceptions: [] }],

// 禁止使用类 eval 的方法,如 setTimeout 传入字符串
'no-implied-eval': 'warn',

// 禁止使用 __iterator__ 属性
'no-iterator': 'error',

// 禁止使用不必要的代码块
'no-lone-blocks': 'error',

// 禁止在循环中的函数内出现外部作用域中定义且会发生变化的变量,以防止闭包副作用
'no-loop-func': 'error',

// 禁止出现多个连续空格
'no-multi-spaces': ['error',{ignoreEOLComments: false}],

// 禁止使用多行字符串
'no-multi-str': 'error',

// 禁止单独 new 一个构造函数而不用于赋值或比较
'no-new': 'error',

// 禁用八进制字面量
'no-octal': 'error',

// 禁止在字符串字面量中使用八进制转义序列,如 var foo = 'Copyright \251';
'no-octal-escape': 'error',

// 禁止使用 __proto__ 属性
'no-proto': 'error',

// 不要重复声明变量和函数
'no-redeclare': 'error',

// 禁止在 return 语句中赋值
'no-return-assign': ['error', 'always'],

// 禁止不必要的 return await
'no-return-await': 'error',

// 禁止使用 javascript:url,如 location.href = 'javascript:void(0)';
'no-script-url': 'error',

// 禁止自我赋值
'no-self-assign': 'error',

// 禁止自我比较
'no-self-compare': 'error',

// 禁止使用逗号操作符,除非用于 for 循环条件或明确用小括号包裹
'no-sequences': 'error',

// 禁止出现未使用的表达式
'no-unused-expressions': ['error',{allowShortCircuit: true,allowTernary: true,allowTaggedTemplates: true}],

// 禁止未使用的标签
'no-unused-labels': 'error',

// 禁止不必要的字符串拼接
'no-useless-concat': 'error',

// 禁止不必要的转义字符
'no-useless-escape': 'error',

// 禁止多余的 return; 语句
'no-useless-return': 'error',

// 不要使用 void 运算符
'no-void': 'error',

// 禁止使用 with
'no-with': 'error',

// 禁止使用不带 await 表达式的 async 函数
'require-await': 'error',

// 将立即执行函数表达式(IIFE)用小括号包裹,即:var x = (function () { return { y: 1 };})(); // wrapped function expression
'wrap-iife': ['error', 'any', { functionPrototypeMethods: false }],

可能的错误或逻辑错误

// getter 需要有返回值
'getter-return': ['error', { allowImplicit: true }],

// 不要与负零进行比较
'no-compare-neg-zero': 'error',

// 不要在循环中使用 await,应使用 Promise.all()
'no-await-in-loop': 'error',

// 不要在条件表达式中使用赋值语句
'no-cond-assign': ['error', 'always'],

// 函数的参数列表中禁止出现重复命名的参数
'no-dupe-args': 'error',

// 对象中禁止出现重复命名的 key
'no-dupe-keys': 'error',

// switch 语句中禁止出现重复的 case
'no-duplicate-case': 'error',

// 不要出现空代码块
'no-empty': 'error',

// 禁止对 catch 的入参重新赋值
'no-ex-assign': 'error',

// 避免不必要的布尔值类型转换
'no-extra-boolean-cast': 'error',

// 禁止不必要的分号
'no-extra-semi': 'error',

// 不要对函数声明重新赋值
'no-func-assign': 'error',

// 不要在块中使用函数声明
'no-inner-declarations': 'error',

// 禁止在 RegExp 构造函数中使用无效的正则表达式
'no-invalid-regexp': 'error',

// 禁止不规则的空白符
'no-irregular-whitespace': 'error',

// 禁止在正则表达式中出现多个连续空格
'no-regex-spaces': 'error',

// 禁用稀疏数组,如 var items = [,,];
'no-sparse-arrays': 'error',

// 避免令人困惑的多行表达式,多是由不加分号导致
'no-unexpected-multiline': 'error',

// 不要在 return 等语句之后出现不可达的代码
'no-unreachable': 'error',

// 禁止在 finally 中出现控制流语句,如 return, throw, break 或 continue
'no-unsafe-finally': 'error',

// 使用 Number.isNaN(),而不是直接与 NaN 进行比较
'use-isnan': 'error',

// 同 typeof 表达式结果进行比较的值必须是有效的字符串,即 'undefined', 'object', 'boolean', 'number', 'string', 'function' 或 'symbol'
'valid-typeof': ['error', { requireStringLiterals: true }]

代码风格

// 方括号内部两侧无空格-数组
'array-bracket-spacing': ['error', 'never'],

// 单行代码块的大括号内部两侧有空格
'block-spacing': ['error', 'always'],

// 大括号换行风格:one true brace style 风格,且单行代码块可不换行
'brace-style': ['error', '1tbs', { allowSingleLine: true }],

// 使用小驼峰命名风格
// TODO 这个暂时没有指定
// camelcase: ['warn',{ properties: 'always', ignoreDestructuring: true }],
camelcase: 'off',

// 用逗号分隔的多行结构,始终加上最后一个逗号(单行不用)
'comma-dangle': ['error', 'always-multiline'],

// 逗号的前面无空格,后面有空格
'comma-spacing': ['error', { before: false, after: true }],

// 用逗号分隔的多行结构,将逗号放到行尾
'comma-style': ['error', 'last'],

// 方括号内部两侧无空格-计算属性
'computed-property-spacing': ['error', 'never'],

// 函数名与调用它的括号间无空格
'func-call-spacing': ['error', 'never'],

// 隐式返回的箭头函数体不要换行
'implicit-arrow-linebreak': ['error', 'beside'],

// 使用 2 个空格缩进
indent: ['error',2]

// 定义对象字面量时,key, value 之间有且只有一个空格
'key-spacing': ['error', { beforeColon: false, afterColon: true }],

// 类成员之间保留一个空行
'lines-between-class-members': ['error', 'always', { exceptAfterSingleLine: false }],

// 使用大驼峰风格命名类和构造函数
'new-cap': ['error',{newIsCap: true,newIsCapExceptions: [],capIsNew: false,capIsNewExceptions: ['Immutable.Map', 'Immutable.Set', 'Immutable.List']}],

// 禁止在调用构造函数时省略小括号
'new-parens': 'error',

// 在长方法链式调用时进行换行,每行最多连续 6 个链式调用
'newline-per-chained-call': ['error', { ignoreChainWithDepth: 6 }],

// 不要使用 new Array() 和 Array() 创建数组,除非为了构造某一长度的空数组。
'no-array-constructor': 'error',

// 不要混用空格和 tab
'no-mixed-spaces-and-tabs': 'error',

// 禁止连续赋值
'no-multi-assign': ['error'],

// 禁止出现多个(大于 2 个)连续空行
'no-multiple-empty-lines': ['error', { max: 2, maxEOF: 1 }],

// 行尾不要留有空格
'no-trailing-spaces': ['error',{skipBlankLines: false,ignoreComments: false]}],

// 避免不必要的三元表达式
'no-unneeded-ternary': ['error', { defaultAssignment: false }],

// 禁止属性调用前有空格
'no-whitespace-before-property': 'error',

// 省略大括号的单行语句前不要换行
'nonblock-statement-body-position': ['error', 'beside', { overrides: {} }],

// 对象的属性需遵循一致的换行风格:即所有属性要么都换行,要么都写在一行
'object-property-newline': ['error',{allowAllPropertiesOnSameLine: true}],

// 一条声明语句声明一个变量
'one-var': ['error', 'never'],

// 对象字面量的属性名不要用引号包裹,除非包含特殊字符
'quote-props': ['error', 'as-needed', { keywords: false, unnecessary: true, numbers: false }],


// 使用分号
semi: ['error', 'always'],

// 分号必须写在行尾
'semi-style': ['error', 'last'],

// 函数声明时,对于命名函数,参数的小括号前无空格;对于匿名函数和 async 箭头函数,参数的小括号前有空格
'space-before-function-paren': ['error',{anonymous: 'always',named: 'never',asyncArrow: 'always'}],

// 小括号内部两侧无空格
'space-in-parens': ['error', 'never'],

// 中缀操作符两侧有空格
'space-infix-ops': 'error',

// 一元操作符两侧无空格,包括 -、+、--、++、!、!!
'space-unary-ops': ['error',{words: true,nonwords: false,overrides: {}}],

// 注释内容和注释符之间需留有一个空格
'spaced-comment': ['error','always',{line: {exceptions: ['-', '+'],markers: ['=', '!']},block: {exceptions: ['-', '+'],markers: ['=', '!'],balanced: true}}],

和变量声明有关

// 禁止 delete 变量
'no-delete-var': 'error',

// 禁止标签与变量同名
'no-label-var': 'error',

// 禁止变量与外层作用域已存在的变量同名
'no-shadow': 'error',

// 禁止使用保留字命名变量
'no-shadow-restricted-names': 'error',

// 禁止使用未声明的变量
'no-undef': 'error',

// 不要将变量初始化成 undefined
'no-undef-init': 'error',

// 声明的变量必须被使用
'no-unused-vars': ['error', { vars: 'all', args: 'after-used', ignoreRestSiblings: true }],

// 不要在声明前就使用变量
'no-use-before-define': ['error', { functions: false, classes: false, variables: false }]

node 有关

关闭全部和 node 有关的一切选项

import 相关

// import 一个文件时,禁止 default import 的名字跟文件内的命名 export 相同
'import/no-named-as-default': 'error',

// import 语句需要放到模块的最上方
'import/first': 'error',

// 不要用多个 import 引入同一模块
'import/no-duplicates': 'error',

// 不要产生自引用
'import/no-self-import': 'error',

// 不要产生循环引用
'import/no-cycle': ['error', { maxDepth: Infinity }],

VUE 相关

// 给 template 提供 eslint-disable 的能力,支持如下注释:
// eslint-disable,eslint-enable,eslint-disable-line,eslint-disable-next-line
'vue/comment-directive': 'error',

// 本条是对JS规约 no-unused-vars 的补充,防止变量被错误地标记为未使用
'vue/jsx-uses-vars': 'error',

// 组件的 data 必须是一个函数
'vue/no-shared-component-data': 'error',

// Prop 定义类型应该是构造函数
'vue/require-prop-type-constructor': 'error',

// Prop 的默认值必须匹配它的类型
'vue/require-valid-default-prop': 'error',

// 为 v-for 设置键值
'vue/require-v-for-key': 'error',

// 避免 v-if 和 v-for 用在一起
'vue/no-use-v-if-with-v-for': 'warn',

// 计算属性禁止包含异步方法
'vue/no-async-in-computed-properties': 'error',

// 禁止在对象字面量中出现重复的键
'vue/no-dupe-keys': 'error',

// 禁止出现重复的属性
'vue/no-duplicate-attributes': 'error',

// 禁止出现语法错误
// https://html.spec.whatwg.org/multipage/parsing.html#parse-errors
'vue/no-parsing-error': ['error', {'x-invalid-end-tag': false,'invalid-first-character-of-tag-name': false}],

// 禁止使用 vue 中的关键字
'vue/no-reserved-keys': 'error',

// 禁止在计算属性中对属性修改
'vue/no-side-effects-in-computed-properties': 'error',

// 禁止在 <textarea> 中出现 {{message}}
'vue/no-textarea-mustache': 'error',

// render 函数必须有返回值
'vue/require-render-return': 'error',

// 计算属性必须有返回值
'vue/return-in-computed-property': 'error',

// 检查指令的合法性
'vue/valid-template-root': 'off',
'vue/valid-v-bind': 'error',
'vue/valid-v-cloak': 'error',
'vue/valid-v-else-if': 'error',
'vue/valid-v-else': 'error',
'vue/valid-v-for': 'error',
'vue/valid-v-html': 'error',
'vue/valid-v-if': 'error',
'vue/valid-v-model': 'error',
'vue/valid-v-on': 'error',
'vue/valid-v-once': 'error',
'vue/valid-v-pre': 'error',
'vue/valid-v-show': 'error',

相关连接

1.1.11

5 months ago