Output SDK CLI を用いてワークフロー(自動処理の流れ)の骨組みファイルを生成します。 次のような場合に使用: - 新しいワークフローを始めるとき - プロジェクトの構造を作成するとき - 生成されたファイルのレイアウトを理解したいとき
Generate workflow skeleton files using the Output SDK CLI. Use when starting a new workflow, scaffolding project structure, or understanding the generated file layout.
このスキルでは、Output SDK CLI を使ってワークフローの基本テンプレートを生成する方法を説明します。テンプレートは必要なファイルと適切な構成をすべて備えたスタート地点を提供します。
npx output workflow generate --skeleton
このコマンドは新しいワークフローの基本的なファイル構成を作成します。
テンプレート生成実行後、以下の構造が作成されます。
src/workflows/{workflow-name}/
├── workflow.ts # ワークフロー定義ファイル
├── steps.ts # ステップ関数定義
├── types.ts # 型スキーマ定義
├── prompts/ # プロンプトファイル用フォルダ
└── scenarios/ # テストシナリオ用フォルダ
テンプレートは Output SDK の標準プロジェクト構成内に作成されます。
src/
├── shared/ # 共有コード(必要に応じて作成)
│ ├── clients/ # API クライアント
│ ├── utils/ # ユーティリティ関数
│ ├── services/ # ビジネスロジック
│ ├── steps/ # 共有ステップ(任意)
│ └── evaluators/ # 評価器(任意)
└── workflows/
└── {workflow-name}/ # あなたの新規ワークフロー
├── workflow.ts
├── steps.ts
├── types.ts
├── prompts/
└── scenarios/
生成後、各ファイルを確認してテンプレート構造を理解します。
workflow.ts — 基本的なワークフロー定義テンプレートを含みます。
import { workflow, z } from '@outputai/core';
import { exampleStep } from './steps.js';
import { WorkflowInputSchema } from './types.js';
export default workflow( {
name: 'workflowName',
description: 'Workflow description',
inputSchema: WorkflowInputSchema,
outputSchema: z.object( { result: z.string() } ),
fn: async input => {
const result = await exampleStep( input );
return { result };
}
} );
steps.ts — ステップのサンプルテンプレートを含みます。
import { step, z } from '@outputai/core';
import { ExampleStepInputSchema } from './types.js';
export const exampleStep = step( {
name: 'exampleStep',
description: 'Example step description',
inputSchema: ExampleStepInputSchema,
outputSchema: z.object( { result: z.string() } ),
fn: async input => {
// ステップの処理をここに実装
return { result: 'example' };
}
} );
types.ts — スキーマ定義を含みます。
import { z } from '@outputai/core';
export const WorkflowInputSchema = z.object( {
// 入力フィールドを定義
} );
export type WorkflowInput = z.infer<typeof WorkflowInputSchema>;
workflow.ts の name プロパティを更新snake_case(例:image_processor)camelCase(例:imageProcessor)types.ts に実際の入力・出力スキーマを定義します。
import { z } from '@outputai/core';
export const WorkflowInputSchema = z.object( {
content: z.string().describe( 'Content to process' ),
options: z.object( {
format: z.enum( [ 'json', 'text' ] ).default( 'json' )
} ).optional()
} );
export type WorkflowInput = z.infer<typeof WorkflowInputSchema>;
export type WorkflowOutput = { processed: string };
関連スキル: output-dev-types-file
サンプルステップを実際のステップ処理に置き換えます。
import { step, z, FatalError, ValidationError } from '@outputai/core';
import { ProcessContentInputSchema } from './types.js';
export const processContent = step( {
name: 'processContent',
description: 'Process the input content',
inputSchema: ProcessContentInputSchema,
outputSchema: z.object( { processed: z.string() } ),
fn: async ( { content } ) => {
// あなたのロジックを実装
return { processed: content.toUpperCase() };
}
} );
関連スキル: output-dev-step-function
ステップをワークフロー内で組み合わせます。
import { workflow, z } from '@outputai/core';
import { processContent } from './steps.js';
import { WorkflowInputSchema } from './types.js';
export default workflow( {
name: 'contentProcessor',
description: 'Process content with custom logic',
inputSchema: WorkflowInputSchema,
outputSchema: z.object( { processed: z.string() } ),
fn: async input => {
const result = await processContent( { content: input.content } );
return result;
}
} );
関連スキル: output-dev-workflow-function
ワークフローが LLM 操作を使う場合、プロンプトファイルを作成します。
prompts/
└── analyzeContent@v1.prompt
関連スキル: output-dev-prompt-file
scenarios フォルダにテスト入力ファイルを追加します。
scenarios/
├── basic_input.json
└── complex_input.json
関連スキル: output-dev-scenario-file
ワークフローが共有クライアント、ユーティリティ、またはサービスを必要とする場合:
# 共有ディレクトリを作成
mkdir -p src/shared/clients
mkdir -p src/shared/utils
mkdir -p src/shared/services
ステップで共有リソースをインポートします。
import { GeminiService } from '../../shared/clients/gemini_client.js';
import { formatDate } from '../../shared/utils/date_helpers.js';
関連スキル: output-dev-http-client-create
カスタマイズ後、ワークフローを検証します。
npx output workflow list
自分のワークフローが表示されるはずです。
npx output workflow run {workflowName} --input path/to/scenarios/basic_input.json
テンプレート生成後の一般的な問題:
.js 拡張子を含まないzod から @outputai/core からインポートされていない// steps.ts
export const stepOne = step( { ... } );
export const stepTwo = step( { ... } );
export const stepThree = step( { ... } );
// workflow.ts
const resultOne = await stepOne( input );
const resultTwo = await stepTwo( resultOne );
const resultThree = await stepThree( resultTwo );
// workflow.ts
const [ resultA, resultB ] = await Promise.all( [
stepA( input ),
stepB( input )
] );
// workflow.ts
if ( input.processImages ) {
await processImages( input );
}
ステップが多い場合はフォルダベースの構成を使用します。
src/workflows/{workflow-name}/
├── workflow.ts
├── steps/ # 単一ファイルではなくフォルダ
│ ├── fetch_data.ts
│ ├── process.ts
│ └── validate.ts
├── types.ts
└── ...
テンプレートの生成とカスタマイズ後:
snake_case に従っているworkflow.ts の名前が camelCase である.js 拡張子を含むz が @outputai/core からインポートされているtypes.ts に定義されているsteps.ts または steps/ フォルダに定義されているnpx output workflow list でワークフローが表示されるsrc/shared/ にあるoutput-dev-folder-structure — フォルダ構成全体を理解するoutput-dev-workflow-function — workflow.ts の詳細ドキュメントoutput-dev-step-function — steps.ts の詳細ドキュメントoutput-dev-types-file — Zod スキーマの作成output-dev-prompt-file — LLM プロンプトの追加output-dev-scenario-file — テストシナリオの作成output-workflow-run — ワークフロー実行output-dev-code-style — コード規約output-workflow-list — 利用可能なワークフロー一覧表示This skill documents how to use the Output SDK CLI to generate a workflow skeleton. The skeleton provides a starting point with all required files and proper structure.
npx output workflow generate --skeleton
This command creates the basic file structure for a new workflow.
After running the skeleton generator, you will have:
src/workflows/{workflow-name}/
├── workflow.ts # Main workflow definition
├── steps.ts # Step function definitions
├── types.ts # Zod schemas and types
├── prompts/ # Empty folder for prompt files
└── scenarios/ # Empty folder for test scenarios
The skeleton is created within the standard Output SDK project structure:
src/
├── shared/ # Shared code (create if needed)
│ ├── clients/ # API clients
│ ├── utils/ # Utility functions
│ ├── services/ # Business logic services
│ ├── steps/ # Shared steps (optional)
│ └── evaluators/ # Shared evaluators (optional)
└── workflows/
└── {workflow-name}/ # Your new workflow
├── workflow.ts
├── steps.ts
├── types.ts
├── prompts/
└── scenarios/
After generation, review each file to understand the template structure:
workflow.ts - Contains a basic workflow template:
import { workflow, z } from '@outputai/core';
import { exampleStep } from './steps.js';
import { WorkflowInputSchema } from './types.js';
export default workflow( {
name: 'workflowName',
description: 'Workflow description',
inputSchema: WorkflowInputSchema,
outputSchema: z.object( { result: z.string() } ),
fn: async input => {
const result = await exampleStep( input );
return { result };
}
} );
steps.ts - Contains example step template:
import { step, z } from '@outputai/core';
import { ExampleStepInputSchema } from './types.js';
export const exampleStep = step( {
name: 'exampleStep',
description: 'Example step description',
inputSchema: ExampleStepInputSchema,
outputSchema: z.object( { result: z.string() } ),
fn: async input => {
// Implement step logic here
return { result: 'example' };
}
} );
types.ts - Contains schema definitions:
import { z } from '@outputai/core';
export const WorkflowInputSchema = z.object( {
// Define input fields
} );
export type WorkflowInput = z.infer<typeof WorkflowInputSchema>;
name property in workflow.tssnake_case (e.g., image_processor)camelCase (e.g., imageProcessor)In types.ts, define your actual input/output schemas:
import { z } from '@outputai/core';
export const WorkflowInputSchema = z.object( {
content: z.string().describe( 'Content to process' ),
options: z.object( {
format: z.enum( [ 'json', 'text' ] ).default( 'json' )
} ).optional()
} );
export type WorkflowInput = z.infer<typeof WorkflowInputSchema>;
export type WorkflowOutput = { processed: string };
Related Skill: output-dev-types-file
Replace the example step with your actual step implementations:
import { step, z, FatalError, ValidationError } from '@outputai/core';
import { ProcessContentInputSchema } from './types.js';
export const processContent = step( {
name: 'processContent',
description: 'Process the input content',
inputSchema: ProcessContentInputSchema,
outputSchema: z.object( { processed: z.string() } ),
fn: async ( { content } ) => {
// Implement your logic
return { processed: content.toUpperCase() };
}
} );
Related Skill: output-dev-step-function
Wire up your steps in the workflow:
import { workflow, z } from '@outputai/core';
import { processContent } from './steps.js';
import { WorkflowInputSchema } from './types.js';
export default workflow( {
name: 'contentProcessor',
description: 'Process content with custom logic',
inputSchema: WorkflowInputSchema,
outputSchema: z.object( { processed: z.string() } ),
fn: async input => {
const result = await processContent( { content: input.content } );
return result;
}
} );
Related Skill: output-dev-workflow-function
If your workflow uses LLM operations, create prompt files:
prompts/
└── analyzeContent@v1.prompt
Related Skill: output-dev-prompt-file
Add test input files to the scenarios folder:
scenarios/
├── basic_input.json
└── complex_input.json
Related Skill: output-dev-scenario-file
If your workflow needs shared clients, utilities, or services:
# Create shared directories if they don't exist
mkdir -p src/shared/clients
mkdir -p src/shared/utils
mkdir -p src/shared/services
Import shared resources in your steps:
import { GeminiService } from '../../shared/clients/gemini_client.js';
import { formatDate } from '../../shared/utils/date_helpers.js';
Related Skill: output-dev-http-client-create
After customization, verify your workflow:
npx output workflow list
Your workflow should appear in the list.
npx output workflow run {workflowName} --input path/to/scenarios/basic_input.json
Common issues after skeleton generation:
.js extensionzod instead of @outputai/core// steps.ts
export const stepOne = step( { ... } );
export const stepTwo = step( { ... } );
export const stepThree = step( { ... } );
// workflow.ts
const resultOne = await stepOne( input );
const resultTwo = await stepTwo( resultOne );
const resultThree = await stepThree( resultTwo );
// workflow.ts
const [ resultA, resultB ] = await Promise.all( [
stepA( input ),
stepB( input )
] );
// workflow.ts
if ( input.processImages ) {
await processImages( input );
}
For workflows with many steps, use folder-based organization:
src/workflows/{workflow-name}/
├── workflow.ts
├── steps/ # Folder instead of single file
│ ├── fetch_data.ts
│ ├── process.ts
│ └── validate.ts
├── types.ts
└── ...
After generating and customizing the skeleton:
snake_case namingworkflow.ts has correct name in camelCase.js extensionz is imported from @outputai/coretypes.tssteps.ts or steps/ foldernpx output workflow listsrc/shared/output-dev-folder-structure - Understanding the complete folder layoutoutput-dev-workflow-function - Detailed workflow.ts documentationoutput-dev-step-function - Detailed steps.ts documentationoutput-dev-types-file - Creating Zod schemasoutput-dev-prompt-file - Adding LLM promptsoutput-dev-scenario-file - Creating test scenariosoutput-workflow-run - Running workflowsoutput-dev-code-style - Code style conventionsoutput-workflow-list - Listing available workflows原文・著作権は Anthropic および各プラグイン作者に帰属します。日本語訳は Claude API による自動翻訳です。