sonarqube.png

写在前面,本文只用于学习目的,不适用于生产环境。

基础概念

image.png

解决的问题

code quality 和 code security 代码质量和代码安全。

使用场景是利用CI工具比如 jenkins 进行代码扫描,看代码是否有漏洞、bug等问题,相当于另起了一套 js 世界里的 eslint,主要是基于多语言的。

之前听说过,代码已提交,远程先扫描,扫描不过会进行提示。那对于前端来说,本地的 eslint + 远程的 sonarqube 让代码的质量更有保障。

现在什么样

可以看到,当前最新版本9,最新的lts是8.9.2,然后我们关注开源的社区版 community

image.png
截至2021-08-16,扫描支持的语言如下,并且和前端有关的在圈画处:
image.png

以js为例,规则集设定如下:
image.png

区分:

  • bug 问题缺陷
  • code smell 坏味道
  • vulnerability 漏洞,会产生风险,比如过于信任用户的输入
  • security hotspot 安全热点

如何安装

可以自托管,那就docker走一套。docker 官方镜像

  1. docker pull sonarqube:lts-community

备注:默认的账号密码是 admin/admin,第一次使用会要求改密码,这里还是改成 123456a。

提供中文,进入 Administration - Marketplace ,搜索 chinese

image.png

重启完,登录,新建项目,起名字、设令牌

24a2b58bb9d60dc0ee97634bb3a032b2ec69be2d

还需要扫描器 https://docs.sonarqube.org/latest/analysis/scan/sonarscanner/
image.png

  1. sonar-scanner \
  2. -Dsonar.projectKey=local \
  3. -Dsonar.sources=. \
  4. -Dsonar.host.url=http://localhost:7000 \
  5. -Dsonar.login=24a2b58bb9d60dc0ee97634bb3a032b2ec69be2d