ci: split publish to build and publish

Author: Saadnajmi

.ado/azure-pipelines.publish.yml

@@ -45,19 +45,20 @@ extends:
         environmentsEs6: true
         environmentsNode: true
     stages:
-      - stage: main
+      - stage: Build
+        displayName: Build & Pack
         jobs:
-          - job: NPMPublish
-            displayName: NPM Publish
+          - job: BuildAndPack
+            displayName: Build, Test & Pack
             pool:
               name: Azure-Pipelines-1ESPT-ExDShared
               image: ubuntu-latest
               os: linux
             templateContext:
               outputs:
                 - output: pipelineArtifact
-                  targetPath: $(System.DefaultWorkingDirectory)
-                  artifactName: dist
+                  targetPath: $(System.DefaultWorkingDirectory)/_packed
+                  artifactName: packed-tarballs
             steps:
               - task: UseNode@1
                 inputs:
@@ -70,25 +71,69 @@ extends:
 
               - script: |
                   yarn buildci
-                displayName: 'yarn buildci [test]'
+                displayName: 'yarn buildci [build + test + lint]'
+
+              - script: |
+                  yarn lage pack --verbose --grouped
+                displayName: 'Pack all public packages'
+
+              - script: |
+                  echo "Packed tarballs:"
+                  ls -la $(System.DefaultWorkingDirectory)/_packed/
+                displayName: 'List packed tarballs'
+
+      - stage: Publish
+        displayName: Publish to NPM
+        dependsOn: Build
+        condition: and(succeeded(), eq(variables['Build.SourceBranch'], 'refs/heads/main'), not(${{ parameters.skipNpmPublish }}))
+        jobs:
+          - job: PublishPackages
+            displayName: Publish NPM Packages
+            pool:
+              name: Azure-Pipelines-1ESPT-ExDShared
+              image: ubuntu-latest
+              os: linux
+            steps:
+              - task: UseNode@1
+                inputs:
+                  version: '22.x'
+                displayName: 'Use Node.js 22.x'
+
+              - task: DownloadPipelineArtifact@2
+                inputs:
+                  artifactName: packed-tarballs
+                  targetPath: $(System.DefaultWorkingDirectory)/_packed
+                displayName: 'Download packed tarballs'
+
+              - script: |
+                  echo "Downloaded tarballs:"
+                  ls -la $(System.DefaultWorkingDirectory)/_packed/
+                displayName: 'List downloaded tarballs'
+
+              - script: |
+                  yarn --immutable
+                displayName: 'yarn install --immutable'
 
               - script: |
                   yarn config set npmPublishAccess public
                   yarn config set npmPublishRegistry "https://registry.npmjs.org"
                   yarn config set npmAuthToken $(npmAuth)
                 displayName: 'Configure yarn for npm publishing'
-                condition: and(succeeded(), eq(variables['Build.SourceBranch'], 'refs/heads/main'), not(${{ parameters.skipNpmPublish }}))
 
               - script: |
                   # https://github.com/changesets/changesets/issues/432
                   # We can't use `changeset publish` because it doesn't support workspaces, so we have to publish each package individually
                   yarn lage publish --verbose --grouped --reporter azureDevops
                 displayName: 'Publish NPM Packages'
-                condition: and(succeeded(), eq(variables['Build.SourceBranch'], 'refs/heads/main'), not(${{ parameters.skipNpmPublish }}))
 
               - script: |
                   yarn config unset npmPublishAccess
                   yarn config unset npmAuthToken
                   yarn config unset npmPublishRegistry
                 displayName: 'Cleanup yarn npm config'
                 condition: always()
+
+              - script: |
+                  git clean -dfx
+                displayName: 'Clean up working directory'
+                condition: always()

.gitignore

@@ -79,6 +79,9 @@ typings/
 # Output of 'npm pack'
 *.tgz
 
+# Pack staging directory
+_packed/
+
 # Yarn Integrity file
 .yarn-integrity
 

lage.config.js

@@ -46,6 +46,15 @@ const config = {
       inputs: [],
       outputs: [],
     },
+    pack: {
+      dependsOn: ['build-all', '^pack'],
+      type: 'worker',
+      options: {
+        worker: 'scripts/src/worker/pack.mts',
+        outputDir: '_packed',
+      },
+      cache: false,
+    },
     publish: {
       dependsOn: ['^publish'],
       type: 'worker',

scripts/src/worker/pack.mts

@@ -0,0 +1,36 @@
+import type { WorkerRunnerFunction } from 'lage';
+
+import { $, fs } from 'zx';
+import { join, resolve } from 'node:path';
+
+/**
+ * Lage worker that runs `yarn npm pack` for each public package,
+ * collecting the resulting .tgz files into a flat staging directory.
+ *
+ * The output directory is passed via `target.options.outputDir` in lage.config.js.
+ * The tgz filename is derived from the package name and version so it is
+ * unique and easy to correlate back to the package.
+ */
+export const run: WorkerRunnerFunction = async ({ target }) => {
+  const pkg = await fs.readJson(join(target.cwd, 'package.json'));
+
+  if (pkg.private) {
+    return;
+  }
+
+  const outputDir = target.options?.outputDir as string | undefined;
+  if (!outputDir) {
+    throw new Error('pack worker requires options.outputDir to be set in lage.config.js');
+  }
+
+  // Resolve relative to cwd (lage runs from repo root, so this resolves correctly)
+  const stagingDir = resolve(outputDir);
+  await fs.mkdirp(stagingDir);
+
+  // Build a safe filename: @fluentui-react-native/button@1.0.0 -> fluentui-react-native-button-1.0.0.tgz
+  const safeName = (pkg.name as string).replace(/@/g, '').replace(/\//g, '-');
+  const tgzFilename = `${safeName}-${pkg.version}.tgz`;
+  const outPath = join(stagingDir, tgzFilename);
+
+  await $({ cwd: target.cwd, verbose: true })`yarn pack --out ${outPath}`;
+};