Tutorial: Getting Started with Fabric

Learn Fabric basics by creating your first file generator.

What You'll Build

A simple generator that creates a JavaScript file with a greeting function.

NOTE

Complete the Installation guide before starting this tutorial.

Step 1: Create Your Generator

Create a file named generate.js with this code:

import { createFabric } from '@kubb/fabric-core'

// This is the code we want to generate
const greetingFunction = `export function greet(name) {
  return \`Hello, \${name}! Welcome to Fabric.\`
}`

// Create a Fabric instance
const fabric = createFabric()

// Add a file to generate
await fabric.addFile({
  baseName: 'greeting.js',
  path: './output/greeting.js',
  sources: [{ value: greetingFunction }],
  imports: [],
  exports: [],
})

// Write the file to disk
await fabric.write()

console.log('✓ File generated successfully!')

Step 2: Run Your Generator

Execute the generator:

bun

bun generate.js

node

node generate.js

Step 3: Check the Output

Open output/greeting.js:

output/greeting.js

export function greet(name) {
  return `Hello, ${name}! Welcome to Fabric.`
}

Understanding the Code

createFabric() - Creates a new generator instance

addFile() - Queues a file for generation:

• baseName - File name
• path - Where to save it
• sources - What code to generate

write() - Writes all queued files to disk

Next Steps

• Using Components - Declarative component-based approach
• Quick Start Guide - Plugins and advanced features
• Core API - Complete API reference