Heim >Web-Frontend >js-Tutorial >TypeScript CLI: Automatisieren Sie Build und Bereitstellen von Skripten

TypeScript CLI: Automatisieren Sie Build und Bereitstellen von Skripten

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2025-01-27 20:31:20211Durchsuche

Ich möchte meinen vorherigen Beitrag über Typscript -CLIS nachverfolgen. So möchte ich fortfahren: Ich habe vor, den Befehl Build zu implementieren, um eine vite -App und den Befehl bereitzustellen, um die App für Amazon S3 und AWS Cloudfront bereitzustellen.

TypeScript CLI: Automatisieren Sie Build und Bereitstellen von Skripten

Erstellen einer Typscript -CLI für Ihren Monorepo

Chris Cook ・ 1 '24

#Typoskript #javaScript #Webdev #Programmierung

Wir werden LISTR2 als Aufgabenläufer verwenden, um die für das Erstellen und Bereitstellen der App erforderlichen Schritte zu definieren. Wir werden Execa verwenden, um CLI -Befehle für Vite und AWS auszuführen. Da wir den TypeScript -Code ausführen, können wir die programmatischen APIs anstelle von CLI -Befehlen verwenden, aber lassen Sie es einfach!

#!/usr/bin/env -S pnpm tsx
import chalk from 'chalk';
import { Command } from 'commander';
import { Listr } from 'listr2';
import { $ } from 'execa';

interface Ctx {
  command: 'build' | 'deploy';
}

const tasks = new Listr<ctx>(
  [
    /**
     * Build tasks
     */
    {
      enabled: (ctx) => ctx.command === 'build' || ctx.command === 'deploy',
      title: 'Build',
      task: (ctx, task): Listr =>
        task.newListr<ctx>([
          /**
           * Runs `vite build`.
           */
          {
            title: `Run ${chalk.magenta('vite build')}`,
            task: async (ctx, task): Promise<void> => {
              const cmd = $({ all: true })`vite build`;
              cmd.all.pipe(task.stdout());

              await cmd;

              task.output = `Build completed: ${chalk.dim('./dist')}`;
            },
            rendererOptions: { persistentOutput: true },
          },
        ]),
    },
    /**
     * Deploy tasks
     */
    {
      enabled: (ctx) => ctx.command === 'deploy',
      title: 'Deploy',
      task: (ctx, task): Listr =>
        task.newListr<ctx>([
          /**
           * Runs `aws s3 sync`.
           */
          {
            title: `Run ${chalk.magenta('aws s3 sync')}`,
            task: async (ctx, task): Promise<void> => {
              const build = './dist';
              const bucket = 's3://my-bucket';

              const cmd = $({ all: true })`aws s3 sync ${build} ${bucket} --delete`;
              cmd.all.pipe(task.stdout());

              await cmd;

              task.output = `S3 sync completed: ${chalk.dim(bucket)}`;
            },
            rendererOptions: { persistentOutput: true },
          },
          /**
           * Runs `aws cloudfront create-invalidation`.
           */
          {
            title: `Run ${chalk.magenta('aws cloudfront create-invalidation')}`,
            task: async (ctx, task): Promise<void> => {
              const distributionId = 'E1234567890ABC';

              const cmd = $({ all: true })`aws cloudfront create-invalidation --distribution-id ${distributionId} --paths /* --no-cli-pager`;
              cmd.all.pipe(task.stdout());

              await cmd;

              task.output = `CloudFront invalidation completed: ${chalk.dim(distributionId)}`;
            },
            rendererOptions: { persistentOutput: true },
          },
        ]),
    },
  ],
  {
    rendererOptions: {
      collapseSubtasks: false,
    },
  },
);

const program = new Command()
  .name('monorepo')
  .description('CLI for Monorepo')
  .version('1.0.0');

program
  .command('build')
  .description('Build the monorepo')
  .action(async () => {
    await tasks.run({ command: 'build' });
  });

program
  .command('deploy')
  .description('Deploy the monorepo')
  .action(async () => {
    await tasks.run({ command: 'deploy' });
  });

await program.parseAsync(process.argv);
</void></void></ctx></void></ctx></ctx>

Die Aufgaben werden in Build -Aufgaben unterteilt und werden Aufgaben bereitgestellt. Da das Bereitstellen einen Build -Schritt erfordert, verwenden wir die aktivierte Eigenschaft, um die Aufgaben basierend auf dem CLI -Befehlsbau oder der Bereitstellung bedingt zu aktivieren. Jede Aufgabe führt den entsprechenden CLI -Befehl aus und überleitet ihre Ausgabe in die Konsole.

Speichern Sie dieses Skript als cli.ts und führen Sie es mit PNPM TSX CLI:

aus

TypeScript CLI: Automatisieren Sie Build und Bereitstellen von Skripten

Das obige ist der detaillierte Inhalt vonTypeScript CLI: Automatisieren Sie Build und Bereitstellen von Skripten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:Von JavaScript nach cNächster Artikel:Von JavaScript nach c