How to setup Sonar/SonarQube/ Sonarts with Angular 4/5/7

SonarQube is an open-source platform for continuous inspection of code quality which do regular code and generate static analysis of code to detect bugs, code smells, and security vulnerabilities. Soon share each and every part of report like what is code smell, css issues, duplicate code etc

Install tslint typescript

npm install tslint typescript --save-dev

Install tslint sonarts

npm install tslint-sonarts –save-dev

 

You will find tslint.json file in root, add the Sonar to the tslint.json configuration file:

{
"defaultSeverity": "error",
"extends": [
"tslint:recommended",
"tslint-sonarts"
],
"jsRules": {},
"rules": {

},
"rulesDirectory": []
}

We need to add two files which are necessary for setup. The first being the “sonar-project.properties” :

sonar.projectKey=Demo:sonar-ts-demo
sonar.projectName=Sonar TS Demo
sonar.projectVersion=1.0
sonar.sourceEncoding=UTF-8
sonar.sources=src
sonar.exclusions=**/node_modules/**,**/*.spec.ts
sonar.tests=src
sonar.test.inclusions=**/*.spec.ts
sonar.ts.tslintconfigpath=tslint.json
sonar.ts.lcov.reportpath=test-results/coverage/coverage.lcov

And the second file tsconfig.json to configure our Typescript root and compiler instructions:
Below is content of file

{
"include": [
"src/**/*"
],
"exclude": [
"node_modules",
"**/*.spec.ts"
]
}

Below are some basic rules for sonar setup.
Rules can easily be disabled/ enabled using the tslint.json or the tslint-sonarts.json:

{
"rulesDirectory": [],
"rules": {
"no-collection-size-mischeck": true,
"no-all-duplicated-branches": true,
"no-duplicated-branches": true,
"no-empty-destructuring": true,
"no-use-of-empty-return-value": true,
"no-identical-conditions": true,
"no-identical-expressions": true,
"no-useless-increment": true,
"no-ignored-return": true,
"no-self-assignment": true,
"no-variable-usage-before-declaration": true,
"no-misspelled-operator": false,
"no-inconsistent-return": false,
"no-unconditional-jump": true,
"no-misleading-array-reverse": true,
"no-empty-nested-blocks": false,
"no-multiline-string-literals": true,
"no-array-delete": true,
"no-dead-store": true
}
}

SonarQube:
Install SonarQube to generate reports of code coverage
Visit

https://www.sonarqube.org/

Select Developer edition 7.6 to download
Extract sonarqube-developer-7.6

If sonarqube is not starting with existing java version then check for version, it requires jdk8

Download jdk8 from below link
https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

Go to D:\path to folder\sonarqube-7.6\bin\windows-x86-64
Run StartSonar.bat
Open localhost:9000 to see your sonarqube dashboard

Add SonarQube path in environment variable:

D:\path here\sonarqube-7.6\bin;