Files
backstage/plugins/sonarqube/README.md
T
Pranava Shashank Pindi 4d1617a3e6 Updated documentation for sonarcloud plugin
For a new react developer working with backstage, he
gets blocked while installing the sonarcloud plugin
in backstage app. He faces the following
[issue](https://github.com/backstage/backstage/issues/5141)
after following the steps mentioned in the plugin
[documentation](https://github.com/backstage/backstage/tree/master/plugins/sonarqube).
Hence, this commit adds `yarn install` and `yarn tsc`
commands to be run.
Also, it adds additional information on how to set the
SONARQUBE_AUTH_HEADER environmental header.

Signed-off-by: pranava29 <pranavshashank.p@zemosolabs.com>
Signed-off-by: pranava29 <pranav.shashank@gmail.com>
2021-04-13 14:59:04 +05:30

2.7 KiB

SonarQube Plugin

The SonarQube Plugin displays code statistics from SonarCloud or SonarQube.

Sonar Card

Getting Started

  1. Install the SonarQube Plugin:
# packages/app

yarn add @backstage/plugin-sonarqube
  1. Add plugin to the app:
// packages/app/src/plugins.ts

export { plugin as SonarQube } from '@backstage/plugin-sonarqube';
  1. Add the SonarQubeCard to the EntityPage:
// packages/app/src/components/catalog/EntityPage.tsx

import { SonarQubeCard } from '@backstage/plugin-sonarqube';

const OverviewContent = ({ entity }: { entity: Entity }) => (
  <Grid container spacing={3} alignItems="stretch">
    // ...
    <Grid item xs={12} sm={6} md={4}>
      <SonarQubeCard entity={entity} />
    </Grid>
    // ...
  </Grid>
);
  1. Add the proxy config:

    Provide a method for your Backstage backend to get to your SonarQube API end point.

SonarCloud

# app-config.yaml

proxy:
  '/sonarqube':
    target: https://sonarcloud.io/api
    allowedMethods: ['GET']
    headers:
      Authorization:
        # Content: 'Basic base64("<api-key>:")' <-- note the trailing ':'
        # Example: Basic bXktYXBpLWtleTo=
        $env: SONARQUBE_AUTH_HEADER

SonarQube

# app-config.yaml

proxy:
  '/sonarqube':
    target: https://your.sonarqube.instance.com/api
    allowedMethods: ['GET']
    headers:
      Authorization:
        # Environmental variable: SONARQUBE_AUTH_HEADER
        # Value: 'Basic base64("<sonar-auth-token>:")'
        # Encode the "<sonar-auth-token>:" string using base64 encoder.
        # Note the trailing colon (:) at the end of the token.
        # Example environmental config: SONARQUBE_AUTH_HEADER=Basic bXktYXBpLWtleTo=
        # Fetch the sonar-auth-token from https://sonarcloud.io/account/security/
        $env: SONARQUBE_AUTH_HEADER

sonarQube:
  baseUrl: https://your.sonarqube.instance.com
  1. Get and provide SONARQUBE_AUTH_HEADER as env variable (https://sonarcloud.io/account/security or https://docs.sonarqube.org/latest/user-guide/user-token/)

  2. Run the following commands in the root folder of the project to install and compile the changes.

yarn install
yarn tsc
  1. Add the sonarqube.org/project-key annotation to the catalog-info.yaml file of the target repo for which code quality analysis is needed.
apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
  name: backstage
  description: |
    Backstage is an open-source developer portal that puts the developer experience first.
  annotations:
    sonarqube.org/project-key: YOUR_PROJECT_KEY
spec:
  type: library
  owner: CNCF
  lifecycle: experimental