如何在build命令完成后触发NX命令？已用dependsOn处理预构建

以下是几个跳出常规dependsOn配置的灵活方案：

1. 利用NX目标扩展（Target Extensions）定义Post-Build钩子 #

直接在项目的project.json中给build目标添加扩展逻辑，把后续要执行的NX命令封装成独立目标，通过nx:run-commands自动触发：

{
  "targets": {
    "build": {
      "executor": "@nx/webpack:webpack",
      "options": { /* 你的build配置 */ },
      "postBuild": {
        "executor": "nx:run-commands",
        "options": {
          "commands": [
            "nx run my-app:generate-sitemap",
            "nx run my-lib:sync-version"
          ],
          "parallel": false
        }
      }
    },
    "generate-sitemap": { /* 对应目标配置 */ },
    "sync-version": { /* 对应目标配置 */ }
  }
}

执行nx build my-app时，build完成后会自动触发postBuild里的命令。还可以针对不同环境配置（如prod/dev）定义不同的post-build逻辑。

2. 用NX任务管道的finalizedBy反向绑定依赖 #

在nx.json的targetDefaults中，给build目标配置finalizedBy，指定build成功后必须执行的目标：

{
  "targetDefaults": {
    "build": {
      "dependsOn": ["^build"],
      "finalizedBy": ["post-build-global"]
    },
    "post-build-global": {
      "executor": "nx:run-commands",
      "options": {
        "commands": ["nx run workspace:clean-artifacts"]
      }
    }
  }
}

和dependsOn的前置依赖不同，finalizedBy是后置触发，适合定义全局通用的post-build任务（比如清理临时文件、同步全局资源），所有项目的build完成后都会自动执行。

3. 编写自定义NX Executor封装Build+Post流程 #

自己实现一个executor，先执行build任务，验证成功后再触发后续NX命令，适合需要复杂流程控制的场景（比如失败时跳过、传递上下文参数）：

// 自定义executor代码（tools/executors/post-build/post-build.impl.ts）
import { ExecutorContext, runExecutor } from '@nx/devkit';

export interface PostBuildExecutorOptions {
  buildOptions: Record<string, any>;
  postTarget: string;
}

export async function postBuildExecutor(
  options: PostBuildExecutorOptions,
  context: ExecutorContext
) {
  // 执行原始build任务
  const buildTask = runExecutor(
    { project: context.projectName, target: 'build' },
    options.buildOptions,
    context
  );

  let buildSuccess = true;
  for await (const output of buildTask) {
    buildSuccess = output.success;
    if (!buildSuccess) break;
  }

  if (buildSuccess) {
    // 触发后续NX目标
    const postTask = runExecutor(
      { project: context.projectName, target: options.postTarget },
      {},
      context
    );

    let postSuccess = true;
    for await (const output of postTask) {
      postSuccess = output.success;
      if (!postSuccess) break;
    }
    return { success: postSuccess };
  }

  return { success: false };
}

然后在project.json中配置使用这个executor：

{
  "targets": {
    "build-with-post": {
      "executor": "@your-workspace/post-build",
      "options": {
        "buildOptions": { /* 原build的options */ },
        "postTarget": "upload-to-cdn"
      }
    },
    "upload-to-cdn": { /* 对应目标配置 */ }
  }
}

执行nx run my-app:build-with-post即可完成build+post流程。

4. 监听NX任务生命周期事件 #

通过NX的任务事件API，监听taskCompleted事件，当指定项目的build成功时触发后续命令：

// 监听脚本（tools/scripts/listen-build-events.js）
const { subscribeToTaskEvents } = require('@nx/devkit');
const { execSync } = require('child_process');

subscribeToTaskEvents((event) => {
  if (
    event.type === 'taskCompleted' &&
    event.targetName === 'build' &&
    event.success &&
    event.projectName === 'my-app'
  ) {
    execSync('nx run my-app:notify-slack', { stdio: 'inherit' });
  }
});

执行build时同时启动监听脚本：

nx build my-app & node tools/scripts/listen-build-events.js

这种方法适合跨项目的全局监听，或者需要和外部系统联动的场景。

内容的提问来源于stack exchange，提问作者99Coder