eslint - 问题汇总
mrdulin opened this issue · comments
eslint规则检查js语法出现的问题,对提升代码质量,具有重要参考意义。
一、react
使用SFC
时,eslint
报[eslint] Component definition is missing display name (react/display-name)
解决:改写为有名函数
二、使用es6
类属性时,eslint
报Parsing error: Unexpected token =
解决:安装babel-eslint
,设置eslint
的parser
为babel-eslint
.
https://github.com/babel/babel-eslint
{
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"modules": true,
"experimentalObjectRestSpread": true
}
},
"extends": [
"eslint:recommended",
"plugin:prettier/recommended",
"plugin:react/recommended"
],
"env": {
"browser": true,
"node": true,
"es6": true
}
}
参考链接:
babel/babel-eslint#312
https://github.com/babel/babel-eslint#why-use-babel-eslint
三、[eslint] Expected parentheses around arrow function argument having a body with curly braces. (arrow-parens)
es6
箭头函数参数期望有小括号()
包围。
fs.rename(oldPath, newPath, err => {
console.log(err);
});
修改为:
fs.rename(oldPath, newPath, (err) => {
console.log(err);
});
四、[eslint] Split 'var' declarations into multiple statements. (one-var)
期望一行一个var
来声明一个变量,而不是用一个var
来声明多个变量。
var oldPathSync = path.normalize('./fs.renametest'),
newPathSync = path.normalize('./renameTest.txt');
修改为:
var oldPathSync = path.normalize('./fs.renametest');
var newPathSync = path.normalize('./renameTest.txt');
五、[eslint] Expected exception block, space or tab after '//' in comment. (spaced-comment)
期望在注释符//
后面有一个空格(space)或制表符(tab).
//同步
修改为:
// 同步
六、[eslint] Missing trailing comma. (comma-dangle)
期望对象键值对和数组最后一个元素后带逗号。
https://eslint.org/docs/rules/comma-dangle
七、[eslint] Unary operator '++' used. (no-plusplus)
建议不使用一元运算符,如'++', '--'
https://eslint.org/docs/rules/no-plusplus
八、[eslint] Unexpected string concatenation. (prefer-template)
建议使用es6
的模版字符串语法,而不是字符串拼接.
https://eslint.org/docs/rules/prefer-template
console.log('Create worker. pid: ' + worker.process.pid);
修改为:
console.log(`Create worker. pid: ${worker.process.pid}`);
九、 [eslint] Unexpected require(). (global-require)
期望require
的调用在模块作用域的顶层。
https://eslint.org/docs/rules/global-require
if (cluster.isMaster) {
require('os')
.cpus()
.forEach(() => {
startWorker();
});
} else {
require('./server')();
}
修改为:
const os = require('os');
const startServer = require('./server');
if (cluster.isMaster) {
os.cpus().forEach(() => {
startWorker();
});
} else {
startServer();
}
十、[eslint] Unexpected lexical declaration in case block. (no-case-declarations)
不允许在switch...case...
的case
语句块中进行词法声明(使用let
, const
, function
和class
)
https://eslint.org/docs/rules/no-case-declarations
switch (app.get('env')) {
case 'development':
app.use(morgan('dev'));
break;
case 'production':
const logDirectory = path.join(__dirname, 'log');
const accessLogStream = rfs('access.log', {
interval: '1d', // rotate daily
path: logDirectory
});
if (!fs.existsSync(logDirectory)) {
fs.mkdirSync(logDirectory);
}
app.use(morgan('combined', { stream: accessLogStream }));
break;
default:
break;
}
修改为:
const logDirectory = path.join(__dirname, 'log');
const accessLogStream = rfs('access.log', {
interval: '1d', // rotate daily
path: logDirectory
});
switch (app.get('env')) {
case 'development':
app.use(morgan('dev'));
break;
case 'production':
if (!fs.existsSync(logDirectory)) {
fs.mkdirSync(logDirectory);
}
app.use(morgan('combined', { stream: accessLogStream }));
break;
default:
break;
}
十一、[eslint] Expected literal to be on the right side of ===. (yoda)
尤达条件如此命名,因为条件的字面值首先出现
https://eslint.org/docs/2.0.0/rules/yoda
if ('/' === req.url) {
//...
}
修改为
if (req.url === '/') {
//...
}