بینش کد Eslint از خطوط لوله Bitbucket

Summarize this content to 400 words in Persian Lang
این راهنما نحوه ادغام نتایج ESLint را با درخواست‌های کششی Bitbucket با استفاده از Pipelines Bitbucket توضیح می‌دهد. شما یاد خواهید گرفت که چگونه گزارش های ESLint را در قالب JSON تولید کنید، آنها را به عنوان حاشیه نویسی درون خطی با استفاده از Bitbucket Reports and Annotations API ارسال کنید و خط لوله Bitbucket را برای اجرای خودکار ESLint پیکربندی کنید.

گزارش ESLint را به صورت JSON ایجاد کنید

ابتدا باید ESLint را اجرا کنید و نتایج را با فرمت JSON خروجی بگیرید. این فایل بعداً برای ایجاد گزارش و حاشیه نویسی استفاده خواهد شد.

اضافه کنید -f و -o ارگ به شما eslint فرمان به عنوان مثال:

eslint . –ext .ts -f json -o eslint-report.json

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

گزارش ESLint و حاشیه نویسی را به Bitbucket ارسال کنید

برای نمایش مستقیم یافته‌های ESLint در درخواست‌های کششی، از API گزارش Bitbucket و Annotations API استفاده خواهید کرد.

گزارش ESLint JSON را بخوانید.
گزارشی با تعداد کل خطاها و هشدارها ایجاد کنید.
یادداشت های درون خطی را بر اساس پیام های ESLint ارسال کنید.

const fs = require(‘fs’)
const path = require(‘path’)
const util = require(‘util’)

// External ID must be unique per report on a commit
const EXTERNAL_ID = ‘com.yorcompany.reports.eslint’
const BB_USER = ‘YOUR_USER’
const BB_REPO = ‘YOUR_REPO’
const BB_URL = ‘https://api.bitbucket.org/2.0’
// This is available by default in the pipeline.
const COMMIT = process.env.BITBUCKET_COMMIT
// For this to be availble you need to create an access token with read access to the repo
// and set it an environment variable in the pipeline.
const TOKEN = process.env.BITBUCKET_TOKEN

// Map ESLint severities to Bitbucket report severities
const severities = {
0: ‘LOW’,
1: ‘MEDIUM’,
2: ‘HIGH’
}

// Read the ESLint JSON report
const data = await util.promisify(fs.readFile)(path.join(process.cwd(), ‘eslint-report.json’), ‘utf8’)
.catch(err => {
console.error(‘Error reading eslint-report.json:’, err)
throw err
})

const eslintOutput = JSON.parse(data)
let totalErrorCount = 0
let totalWarningCount = 0
const annotations = [] let i = 1

eslintOutput.forEach(file => {
totalErrorCount += file.errorCount
totalWarningCount += file.warningCount

const relativePath = path.relative(process.cwd(), file.filePath)

file.messages.forEach(message => {
annotations.push({
external_id: `${EXTERNAL_ID}.${COMMIT}.${i++}`,
path: relativePath,
annotation_type: ‘CODE_SMELL’,
summary: message.message,
line: message.line,
severity: severities[message.severity] })
})
})

// Prepare the report
const report = {
title: ‘ESLint Report’,
details: ‘Results from ESLint analysis’,
report_type: ‘TEST’,
logoUrl: ‘https://eslint.org/img/logo.svg’,
data: [
{
title: ‘Error Count’,
type: ‘NUMBER’,
value: totalErrorCount
},
{
title: ‘Warning Count’,
type: ‘NUMBER’,
value: totalWarningCount
}
] }

try {
// Post the report to Bitbucket
const reportUrl = `${BB_URL}/repositories/${BB_USER}/${BB_REPO}/commit/${COMMIT}/reports/${EXTERNAL_ID}`
let response = await fetch(reportUrl, {
method: ‘PUT’,
body: JSON.stringify(report),
headers: {
‘Content-Type’: ‘application/json’,
‘Accept’: ‘application/json’,
‘Authorization’: `Bearer ${TOKEN}`
}
})

if (!response.ok) {
console.error(await response.text())
throw new Error(`Error posting report: ${response.statusText}`)
}

console.log(‘Report posted successfully!’)
console.log(await response.json())

// Post annotations if any
if (annotations.length > 0) {
const annotationsUrl = `${BB_URL}/repositories/${BB_USER}/${BB_REPO}/commit/${COMMIT}/reports/${EXTERNAL_ID}/annotations`
response = await fetch(annotationsUrl, {
method: ‘POST’,
body: JSON.stringify(annotations),
headers: {
‘Content-Type’: ‘application/json’,
‘Accept’: ‘application/json’,
‘Authorization’: `Bearer ${TOKEN}`
}
})

if (!response.ok) {
console.error(await response.text())
throw new Error(`Error posting annotations: ${response.statusText}`)
}

console.log(‘Annotations posted successfully!’)
console.log(await response.json())
}

} catch (error) {
console.error(‘Error posting insights:’, error.response ? error.response.data : error.message)
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

Bitbucket Pipeline را پیکربندی کنید

برای خودکارسازی این فرآیند به عنوان بخشی از گردش کار CI/CD خود، می توانید یک خط لوله Bitbucket برای اجرای ESLint، تولید گزارش JSON و ارسال نتایج راه اندازی کنید. در زیر یک نمونه است bitbucket-pipelines.yml فایل برای شروع:

image: node:18.13.0

pipelines:
default:
– step:
name: ESLint
caches:
– node
script:
– npm install
– npx eslint . –ext .ts -f json -o eslint-report.json # Run ESLint and save the report
after-script:
– node post-eslint-results.js # Post results to Bitbucket
artifacts:
– eslint-report.json

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

توجه داشته باشید

گزارش به Bitbucket در پست شده است after-script زیرا بعدی scriptاگر eslint کد خروج غیر 0 را برگرداند (اگر ESLint خطا داشته باشد)، s فراخوانی نخواهد شد.

eslint . --ext .ts -f json -o eslint-report.json

const fs = require('fs')
const path = require('path')
const util = require('util')

// External ID must be unique per report on a commit
const EXTERNAL_ID = 'com.yorcompany.reports.eslint'
const BB_USER = 'YOUR_USER'
const BB_REPO = 'YOUR_REPO'
const BB_URL = 'https://api.bitbucket.org/2.0'
// This is available by default in the pipeline.
const COMMIT = process.env.BITBUCKET_COMMIT
// For this to be availble you need to create an access token with read access to the repo
//  and set it an environment variable in the pipeline.
const TOKEN = process.env.BITBUCKET_TOKEN

// Map ESLint severities to Bitbucket report severities
const severities = {
    0: 'LOW',
    1: 'MEDIUM',
    2: 'HIGH'
}

// Read the ESLint JSON report
const data = await util.promisify(fs.readFile)(path.join(process.cwd(), 'eslint-report.json'), 'utf8')
    .catch(err => {
        console.error('Error reading eslint-report.json:', err)
        throw err
    })

const eslintOutput = JSON.parse(data)
let totalErrorCount = 0
let totalWarningCount = 0
const annotations = []
let i = 1

eslintOutput.forEach(file => {
    totalErrorCount += file.errorCount
    totalWarningCount += file.warningCount

    const relativePath = path.relative(process.cwd(), file.filePath)

    file.messages.forEach(message => {
        annotations.push({
            external_id: `${EXTERNAL_ID}.${COMMIT}.${i++}`,
            path: relativePath,
            annotation_type: 'CODE_SMELL',
            summary: message.message,
            line: message.line,
            severity: severities[message.severity]
        })
    })
})

// Prepare the report
const report = {
    title: 'ESLint Report',
    details: 'Results from ESLint analysis',
    report_type: 'TEST',
    logoUrl: 'https://eslint.org/img/logo.svg',
    data: [
        {
            title: 'Error Count',
            type: 'NUMBER',
            value: totalErrorCount
        },
        {
            title: 'Warning Count',
            type: 'NUMBER',
            value: totalWarningCount
        }
    ]
}

try {
    // Post the report to Bitbucket
    const reportUrl = `${BB_URL}/repositories/${BB_USER}/${BB_REPO}/commit/${COMMIT}/reports/${EXTERNAL_ID}`
    let response = await fetch(reportUrl, {
        method: 'PUT',
        body: JSON.stringify(report),
        headers: {
            'Content-Type': 'application/json',
            'Accept': 'application/json',
            'Authorization': `Bearer ${TOKEN}`
        }
    })

    if (!response.ok) {
        console.error(await response.text())
        throw new Error(`Error posting report: ${response.statusText}`)
    }

    console.log('Report posted successfully!')
    console.log(await response.json())

    // Post annotations if any
    if (annotations.length > 0) {
        const annotationsUrl = `${BB_URL}/repositories/${BB_USER}/${BB_REPO}/commit/${COMMIT}/reports/${EXTERNAL_ID}/annotations`
        response = await fetch(annotationsUrl, {
            method: 'POST',
            body: JSON.stringify(annotations),
            headers: {
                'Content-Type': 'application/json',
                'Accept': 'application/json',
                'Authorization': `Bearer ${TOKEN}`
            }
        })

        if (!response.ok) {
            console.error(await response.text())
            throw new Error(`Error posting annotations: ${response.statusText}`)
        }

        console.log('Annotations posted successfully!')
        console.log(await response.json())
    }

} catch (error) {
    console.error('Error posting insights:', error.response ? error.response.data : error.message)
}

image: node:18.13.0

pipelines:
  default:
    - step:
        name: ESLint
        caches:
          - node
        script:
          - npm install
          - npx eslint . --ext .ts -f json -o eslint-report.json  # Run ESLint and save the report
        after-script:
          - node post-eslint-results.js  # Post results to Bitbucket
        artifacts:
          - eslint-report.json