如何在执行NX的serve/storybook命令前运行自定义bash脚本？

翻译后的提问 #

我希望在运行serve命令前执行一个.sh脚本，请问NX中是否有类似“before”的配置选项？具体来说，我想在执行npx nx run projectName:storybook或projectName:serve命令时，在主命令启动前运行该bash脚本，当前我的配置示例如下：

"projectName": {
      "root": "path/testPath",
      "sourceRoot": "path/testPath",
      "projectType": "application",
      "targets": {
        "serve": {
           ...
          },
          "configurations": {
             ...
          },
          "before": ["nx run testTest:alex"]
        },
        "storybook": {
          "executor": "@nrwl/storybook:storybook",
          "options": { 
            ...
          },
          "configurations": {
            "ci": {
              "quiet": true
            }
          },
          "before": ["nx run testTest:alex"]
        },

NX 本身没有原生的before配置字段，但可以通过两种官方推荐的方式实现需求：

方法一：用 dependsOn 配置 target 依赖（推荐） #

这是最贴合 NX 生态的做法，步骤如下：

1. 在项目的targets里新增一个执行 bash 脚本的专属 target，比如命名为pre-script：

   "projectName": {
     // ... 其他原有配置
     "targets": {
       "pre-script": {
         "executor": "nx:run-commands",
         "options": {
           "command": "./path/to/your-script.sh" // 替换为你的实际脚本路径
         }
       },
       // ... 其他原有target
     }
   }
   

2. 在serve和storybook的 target 中添加dependsOn字段，指定先执行前置任务：

   "serve": {
     // ... 原有配置
     "dependsOn": ["pre-script"]
   },
   "storybook": {
     "executor": "@nrwl/storybook:storybook",
     // ... 原有配置
     "dependsOn": ["pre-script"]
   }
   

   如果需要依赖其他项目的 target（比如你示例中的testTest:alex），直接将其加入dependsOn数组即可：

   "dependsOn": ["testTest:alex", "pre-script"]
   

方法二：自定义 Executor（复杂场景适用） #

如果需要更灵活的控制逻辑（比如根据条件判断是否执行脚本），可以编写自定义 executor：

1. 创建自定义 executor 包，在代码中先调用 bash 脚本，再触发原 serve/storybook 的 executor 逻辑。
2. 将serve或storybook的executor替换为你自定义的 executor。

注意：你当前配置中的before字段是无效的，NX 不会识别该配置项，需替换为上述dependsOn方式。

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