[SonarQube Javascript] How does SonarJS support different JS framework?

SonarQube
1

Hi All,

We have developed a SonarJS custom plugin, and we’d like to run it under different JS framworks,

I see from this official link, which mentioned:

Supported Frameworks and Versions

  • ECMAScript 5 / ECMAScript 2015 (ECMAScript 6) / ECMAScript 2016 / ECMAScript 2017
  • React JSX
  • Vue.js
  • Flow

But I don’t quite understand how are these frameworks supported.

When run the custom plugin under those framework projects, I currently found below ways:

  • sonar-scanner CLI
  • for nodejs, ‘npm run sonar’ (is there similar for React, Vue?)
  • SonarEsLintPlugin (deprecated?)
  • Eslint and import issues into SonarQube

We are currently use sonar-scanner CLI, but have no clear idea how different framework is handled in the backend. Could you help clarify and sugget the best practice? Thank you very much in advance!

Our Environment:

  • SonarQube 7.5, Scanner, Plugin, and any relevant extension)
2

Hi @Vwan,

Could you be more clear about your use-case?

JavaScript analyzer is able automatically parse JSX, Vue and Flow, no additional configuration is required.

So to execute your custom rules, simply run sonar-scanner CLI with your plugin installed on the SonarQube you use (and don’t forget to activate rules).

3

Hi @Lena,

Thank you for your reply, sorry I didn’t make it very clear.

In our case, we are adding a custom rule to checking for internationalized hardcoded string issues;

JS script is too flexible, we found quite many false-reported bugs for different frameworks. so we are thinking to find a way that can automatically identify framework-specific syntax e.g. require(‘modulename’) and ignore the scanning on it, that’s why I’m asking for the help, please let me know if more details are needed, thank you~

4

Indeed you can rely on import and require when visiting AST in your rule. SonarJS does not provide any other way to do it

5

We will try that, thank you @Lena