Document

使用 ESLint 配置规则可以帮助你捕获和避免 null 和 undefined 的不当使用。下面是一些常用的 ESLint 规则和配置示例，以确保代码中对 null 和 undefined 的使用更加规范。

一、安装 ESLint

如果还没有安装 ESLint，可以通过 npm 安装：

npm install eslint --save-dev

然后，初始化 ESLint 配置：

npx eslint --init

二、配置 ESLint 规则

在 .eslintrc.js 或 .eslintrc.json 配置文件中，可以添加以下规则：

1. 禁止使用 null 和 undefined

可以通过 no-null/no-undefined 插件来禁止使用 null 和 undefined。

安装插件

npm install eslint-plugin-no-null --save-dev

配置示例

在 .eslintrc.js 中添加插件和规则：

module.exports = {
    // ...
    plugins: ['no-null'],
    rules: {
        'no-null/no-null': 'error',
        'no-undefined': 'error', // 不允许使用 undefined
    },
};

2. 使用 no-unused-vars 规则

确保未使用的变量不会被定义为 null 或 undefined。这可以通过 no-unused-vars 规则来实现。

配置示例

module.exports = {
    // ...
    rules: {
        'no-unused-vars': 'error', // 不允许未使用的变量
    },
};

3. 使用 consistent-return 规则

确保函数始终返回一个值，可以通过 consistent-return 规则来实现。

配置示例

module.exports = {
    // ...
    rules: {
        'consistent-return': 'error', // 函数必须返回一个值或不返回
    },
};

4. 使用 eqeqeq 规则

建议使用严格相等比较（=== 和 !==），可以通过 eqeqeq 规则来实现。

配置示例

module.exports = {
    // ...
    rules: {
        'eqeqeq': ['error', 'always'], // 强制使用全等
    },
};

三、完整的 ESLint 配置示例

以下是一个完整的 .eslintrc.js 示例，结合了上述规则：

module.exports = {
    env: {
        browser: true,
        es2021: true,
    },
    extends: 'eslint:recommended',
    parserOptions: {
        ecmaVersion: 12,
    },
    plugins: ['no-null'],
    rules: {
        'no-null/no-null': 'error', // 禁止使用 null
        'no-unused-vars': 'error', // 禁止未使用的变量
        'consistent-return': 'error', // 函数必须一致返回
        'eqeqeq': ['error', 'always'], // 强制使用全等
    },
};

四、实际应用

1. 运行 ESLint：在项目中运行 ESLint 检查代码。

   npx eslint .
   

2. 修复问题：根据 ESLint 的提示，修复代码中不符合规则的部分。