前端使用sonar分析代码质量

菜菜真的不知道
9,477 阅读4分钟

sonar

sonar介绍

  1. sonar是一款静态代码质量分析工具，支持Java、Python、PHP、JavaScript、CSS等25种以上的语言；
  2. 而且能够集成在IDE、Jenkins、Git等服务中，方便随时查看代码质量分析报告；
  3. sonar通过配置的代码分析规则，从可靠性、安全性、可维护性、覆盖率、重复率等方面分析项目，风险等级从A~E划- 分为5个等级；
  4. sonar设置了质量门，通过设置的质量门评定此次提交分析的项目代码是否达到了规定的要求；
  5. sonar可以集成pmd、findbugs、checkstyle等插件来扩展使用其他规则来检验代码质量；

使用sonar目的

对于团队而言，编写干净的代码对于维护健康的代码至关重要。 代码是否健康主要由以下四个指标来判断：

  1. 可读性：代码是否可读易读，对于一个团队来说，编码标准是否一致，编码风格是否一致；
  2. 功能性：代码正确得实现了业务逻辑；
  3. 可维护性：代码逻辑是有层次的，是容易修改的；
  4. 高效性：代码实现在时间和空间的使用上是高效的； 团队成员可能每个人对于代码的标准及风格不同，即使通过eslint等约束也不一定能从多个维度保证代码质量，只能检测基础语法等代码质量问题。 所以引入一个可以保证团队成员代码标准一致，质量稳定，风格稳定的工具也许是有必要的。

sonar功能

它是从 Architecture Design（架构设计） , Coding Rule（编码规则）, Potential Bugs（潜在错误）, Duplications（重复代码）, Comments（注释）, Unit Tests（单元测试）, Complexity（复杂度） 7个维度检查代码质量的。 相比lint工具检测维度比较全面, 有可视化的友好展示代码缺陷的界面，结合CI/CD工具，可以不依赖手工检查，定时清查代码。

sonarlint可以结合IDEA作为开发约束， sonarQube可以结合自动化构建工具检查分析代码质量，并输出代码检测可视化界面。

sonar使用

sonarlint -- 开发进行时的idea分析工具

以vscode举例，在扩展里面安装sonarlint，可以在写代码的时候在编辑器内或控制台给出提示；
检测到低质量代码会用不同颜色的波浪线提示，并给提供修复方案；

e.g.1：检测低质量代码

e.g.2：不合规代码

e.g.3：无用代码及注释

e.g.4：检测代码复杂度

如何计算函数复杂度，美团点评写过一篇文章，感兴趣可以看一看。

sonarQube -- 代码质量管理平台

搭建代码质量管理平台

前置条件
  1. You must be able to install Java (Oracle JRE or OpenJDK) on the machine where you plan to run SonarQube（必须安装Java才能使用SonarQube）.
  2. A small-scale (individual or small team) instance of the SonarQube server requires at least 2GB of RAM to run efficiently and 1GB of free RAM for the OS. If you are installing an instance for a large teams or Enterprise, please consider the additional recommendations below（主机运行SonarQube服务器至少需要2GBRAM）.
  3. SonarQube does not support 32-bit systems on the server side. SonarQube does, however, support 32-bit systems on the scanner side（不支持32位系统）.
安装
安装JDK

SonarQube 服务器需要 Java 版本11支持，而 SonarQube 扫描器需要 Java 版本11或17支持，所以选择Java11安装。

安装SonarQube Server

下载SonarQube Server，需要安装社区版，目前其他版本收费。本文安装到D:\sonar\sonarqube-9.6.0.59041目录。

安装完成后进入D:\sonar\sonarqube-9.6.0.59041\bin\windows-x86-64目录，打开cmd，执行StartSonar。

cmd窗口显示SonarQube is up或SonarQube is operational，SonarQube Server 启动成功。

浏览器打开本地SonarQube，初始账号/密码是admin。

检测项目

  1. 新建项目，这里选择本地项目。

  2. 创建项目名及项目key

  1. 创建凭据

  2. 选择语言和操作系统

  1. 官方提供了多种版本下载，这里安装的是window64scanner版本，本文的安装目录是D:\sonar\sonar-scanner-4.7.0.2747-windows，新增用户环境变量path：D:\sonar\sonar-scanner-4.7.0.2747-windows\bin

  2. 进入项目目录，在控制台执行（这里在项目src目录下执行）

sonar-scanner.bat -D"sonar.projectKey=h5viewer" -D"sonar.sources=." -D"sonar.host.url=本地服务器地址" -D"sonar.login=凭据"
  1. 执行完毕可以去浏览器查看分析报告

查看分析报告

  1. bugs：检测不合规语法等错误；

  1. 缺陷：下图缺陷是没有验证发送方/接收方的身份和起源；

  1. 安全漏洞：

下图是不合理的正则可能导致的安全漏洞，暴露漏洞并提出解决方案

  1. 技术债务

维基百科简单介绍了一下技术债务（Technical debt），目前没有了解技术债务，但是从分析报告上来看，指的是无效代码/低质量代码等，技术债务包括了代码异味等。

  1. 代码异味

简单来说就是低质量代码/无用代码等。

  1. 单元测试（单元测试覆盖率）
  2. 代码重复率（分析代码重复率）
avatar
文章
阅读
粉丝