本指南解释了如何使用 bitbucket pipelines 将 eslint 结果集成到 bitbucket pull 请求中。您将学习如何生成 json 格式的 eslint 报告，使用 bitbucket 报告和注释 api 将这些报告作为内联注释发布，以及配置 bitbucket 管道以自动运行 eslint。
首先，您需要运行 eslint 并以 json 格式输出结果。该文件稍后将用于创建报告和注释。
将 -f 和 -o 参数添加到 eslint 命令中。例如：
eslint . --ext .ts -f json -o eslint-report.json
要直接在拉取请求中显示 eslint 结果，您将使用 bitbucket 的报告 api 和注释 api。
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)
}
要将此过程自动化为 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，因为如果 eslint 返回非 0 退出代码（如果 eslint 有错误），后续脚本将不会被调用。