sublime怎样配置ESLint检查 sublimeJavaScript代码规范验证-sublime-PHP中文网

sublime怎样配置ESLint检查 sublimeJavaScript代码规范验证

絕刀狂花

发布： 2025-08-28 12:56:01

原创

503人浏览过

安装 sublimelinter 和 sublimelinter-eslint 插件；2. 全局或本地安装 eslint；3. 使用 eslint --init 创建配置文件并选择代码风格；4. 在 sublimelinter 设置中配置使用本地 eslint 路径；5. 重启 sublime text 并验证 eslint 是否正常工作；6. 通过 .eslintignore 忽略指定文件检查；7. 使用 sublimefixer 等插件辅助修复错误；最终实现 sublime text 实时检测 javascript 代码质量的目标。

sublime怎样配置ESLint检查 sublimeJavaScript代码规范验证

Sublime Text 配置 ESLint 主要是为了在编写 JavaScript 代码时，能够实时检测代码风格和潜在错误，提高代码质量。简单来说，就是让 Sublime 像个严格的代码老师一样，随时指出你的问题。

解决方案：

安装必要的包:

立即学习“Java免费学习笔记（深入）”；

首先，确保你已经安装了 Package Control。如果没有，去 Sublime Text 官网找安装方法，很简单。然后，通过 Package Control 安装以下两个包：
- ```
SublimeLinter
```
  登录后复制
  : 这是一个通用的代码检查框架。
- ```
SublimeLinter-eslint
```
  登录后复制
  : 这是 ESLint 的 SublimeLinter 插件。
安装方法：
```
Ctrl+Shift+P
```
登录后复制
(Windows/Linux) 或
```
Cmd+Shift+P
```
登录后复制
(macOS)，输入
```
Install Package
```
登录后复制
，然后搜索并安装上述两个包。
安装 ESLint:

全局安装 ESLint：
```
npm install -g eslint
```
登录后复制
或者，如果你更喜欢项目本地安装：
```
npm install eslint --save-dev
```
登录后复制
本地安装的话，需要在项目根目录下配置 ESLint。

配置 ESLint:

如果你是第一次使用 ESLint，需要创建一个配置文件。在项目根目录下执行：

eslint --init

登录后复制

这个命令会引导你创建一个

.eslintrc.js

登录后复制

、

.eslintrc.yaml

登录后复制

或

.eslintrc.json

登录后复制

文件。根据你的喜好选择一种格式，并按照提示配置你的代码风格规则。比如，你可以选择 Airbnb、Google 或 Standard 等流行的代码风格。

一个简单的

.eslintrc.js

登录后复制

示例：

module.exports = {
    "env": {
        "browser": true,
        "es6": true,
        "node": true
    },
    "extends": "eslint:recommended",
    "parserOptions": {
        "ecmaVersion": 2018,
        "sourceType": "module"
    },
    "rules": {
        "indent": [
            "error",
            4
        ],
        "linebreak-style": [
            "error",
            "unix"
        ],
        "quotes": [
            "error",
            "single"
        ],
        "semi": [
            "error",
            "always"
        ]
    }
};

登录后复制

这个配置启用了 ES6 支持，并设置了缩进为 4 个空格，行尾风格为 Unix，使用单引号，以及语句结尾必须有分号。

SublimeLinter 配置:

SublimeLinter 默认会使用全局安装的 ESLint。如果你想使用项目本地的 ESLint，需要修改 SublimeLinter 的配置。

代码小浣熊
代码小浣熊是基于商汤大语言模型的软件智能研发助手，覆盖软件需求分析、架构设计、代码编写、软件测试等环节

51

查看详情

打开 Sublime Text 的 Preferences -> Package Settings -> SublimeLinter -> Settings - User，添加以下配置：
```
{
    "linters": {
        "eslint": {
            "executable": "node_modules/.bin/eslint",
            "use_local": true
        }
    }
}
```
登录后复制
```
executable
```
登录后复制
指向项目本地的 ESLint 可执行文件，
```
use_local
```
登录后复制
设置为
```
true
```
登录后复制
表示使用本地 ESLint。
重启 Sublime Text:

修改配置后，重启 Sublime Text 使配置生效。
验证:

打开一个 JavaScript 文件，故意违反一些 ESLint 规则，看看 SublimeLinter 是否会提示错误。如果一切正常，你应该能看到 Sublime Text 在代码中标记出不符合 ESLint 规则的地方。