请知悉:本文最近一次更新为 4年 前,文中内容可能已经过时。

最近团队新进了几个前端的同学,来之前他们那边一直没有搞代码检测,所以整理了下VScode Sonarlint的使用 图文教程,以供参考。

  1. SonarLint插件安装

    左侧打开Extensions插件图标进入插件搜索页,搜索Sonar,找到SonarLint并点击install安装。

    1 安装SonarLint

  2. SonarLint插件设置

    安装结束后,点击插件的齿轮,选择Extension Settings,进入插件配置页。

    Extension Settings

  3. 点击Edit in settings.json,打开配置文件

    2 编辑接入Sonarqube的配置

  4. 将以下代码覆盖原始文件内容并保存:
    {
    "sonarlint.connectedMode.connections.sonarqube": [
    {
    "serverUrl": "https://sonar服务器地址和端口/",
    "token": "token字符串"
    }
    ],
    "sonarlint.output.showAnalyzerLogs": true,
    "sonarlint.output.showVerboseLogs": true,
    "sonarlint.connectedMode.project": {
    "projectKey": "项目ID"
    }
    }
  5. 至此,SonarLint配置结束。
  6. SonarQube规则更新方式
    F1键呼出命令框,输入关键字:Sonar,找到指令:Update SonarLint binding to SonarQube/SonarCloud
    点击后右下会弹出更新SonarQube规则提示窗。
    待规则更新结束后,重启VS Code编辑器。
  7. SonarQube项目代码检测示例

    VS Code编辑器启动结束,确保右侧规则加载结束。点击底部呼出状态输出栏,即可核对检测结果。

    5 点击底部呼出状态输出栏 核对规则


参考资料

Sonarlint for VScode update binding “connect mode”


如您从本文得到了有价值的信息或帮助,请考虑扫描文末二维码捐赠和鼓励。

尊重他人劳动成果。转载请务必附上原文链接,我将感激不尽。


与《VScode Sonarlint的使用 图文教程》相关的博文:


留言

avatar
😀
😀😁😂😅😭🤭😋😘🤔😰😱🤪💪👍👎🤝🌹👌