解决 ESLint 配置失效的问题

发生背景

准备用 ESLint 做代码风格管理，配置文件写完后发现个大问题：
分号结尾配置项在 .js 文件中生效，但在 .ts 中不生效。

相关代码

.eslintrc.js：

const process = require('process');

module.exports = {
  root: true,
  env: {
    node: true,
  },
  extends: 'standard-with-typescript',
  parserOptions: {
    project: ['./tsconfig.json'],
    ecmaVersion: 11,
    sourceType: 'module',
  },
  rules: {
    'comma-dangle': [2, 'only-multiline'],
    curly: [2, 'multi-line'],
    'no-debugger': process.env.NODE_ENV === 'production' ? ['error'] : ['off'],
    quotes: [2, 'single'],
    semi: [2, 'always'],
  }
};

解决方案

根据 TypeScript ESLint 官方文档所说，在 rules 中 添加 @typescript-eslint/semi 属性，值与 semi 属性相同。

@@ -17,5 +17,6 @@ module.exports = {
     'no-debugger': process.env.NODE_ENV === 'production' ? ['error'] : ['off'],
     quotes: [2, 'single'],
     semi: [2, 'always'],
+    '@typescript-eslint/semi': [2, 'always'],
   }
 };

发生原因

这是 TypeScript 对 semi 规则的拓展，详见官方文档。

参考资料

• semi | typescript-eslint