Intro

quickbuild 是一个基于nodejs的构建工具，主要用于快速构建前端项目，适用于单项目或monorepo项目。该项目可单独执行构建命令，或是启动构建服务，并在构建过程中通过websocket实现实时构建消息通知。

Quick Start

# 全局安装
npm install -g @daiyu-5577/quickbuild

# 一、用于CI/CD流程，或定时任务执行构建命令
# 在项目根目录执行构建命令，-b 为需要构建的分支
quickbuild build -b dev

# 对于monorepo项目，在项目根目录执行构建命令，-p 表示需要构建的子项目路径，并可传递多个子项目路径
quickbuild build -b dev -p pkg/help
quickbuild build -b dev -p pkg/help2
quickbuild build -b dev -p pkg/help pkg/help2 pkg/help3

# 或者执行如下命令进行子项目变更分析，仅对变更项目进行构建，-c 表示需要构建的commit range，会根据commit range构建对应子项目
quickbuild build -b dev -c HEAD~...HEAD

# 可通过 -n 实现实时构建消息通知
quickbuild build -b dev -c HEAD~...HEAD -n http://127.0.0.1:3000/notify

# 二、启动 build server 服务可用于页面构建消息通知和构建日志预览
# 启动路径下可使用 git clone 预先拉取需要构建的前端项目
# 服务启动后可访问 http://localhost:3000/page
quickbuild server -p 3000

# 三、启动 build server 开启静态站点服务
# --website 设置静态站点文件的根路径，--website-prefix 设置访问静态站点的前缀baseurl
# 例如：
# --website=/www --website-prefix=page
# /www 路径下存放了多个spa项目，每个spa项目有自己的index.html文件
# 例如存在：/www/help/index.html /www/help2/index.html
# 服务启动后可访问如下spa项目
# http://localhost:3000/page/help
# http://localhost:3000/page/help2
# 注意：spa项目构建时，如react-router需要配置basename=/page/help（help为/www路径下的文件夹名），构建工具如vite，还需配置base: '/page/react'
quickbuild server -p 3000 --website /www

# pm2 启动
pm2 start "quickbuild server -p 3030" --name quickbuild

# pm2 启动 开启静态站点服务
pm2 start "quickbuild server -p 3030 --website /var/www/html --website-prefix /" --name quickbuild

# 启动服务的 nginx 配置
location ^~ /quick/ {
  proxy_pass http://127.0.0.1:3000/;
  proxy_http_version 1.1;
  proxy_set_header Host $host;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection $connection_upgrade;
}

github webhook notice json

// step1
// 在quickbuild服务启动目录下创建 notice.json 文件
// httpsOrigin 为 github 项目的 https 地址
// branch 为需要触发通知的分支
// webhook 为github触发webhook后由quickbuild通知你的请求地址
[
  {
    "httpsOrigin": "",
    "branch": "",
    "webhook": ""
  },
]

// step2
// github add webhooks
// 选择 push 事件
// 填写 webhook 地址
// 选择 application/json 格式
http://you_host/quick/api/github 

Script

# 本地启动 build command
npm run start:build

# 本地启动 build server command
npm run start:server

# 构建生产 dist
npm run tsc