Zum Hauptinhalt springen

Neue Dateien mit dem Agenten erstellen

Der KI-Agent von Cursor ist ein leistungsstarkes Werkzeug zum Erstellen und Verwalten neuer Dateien. Dieser Leitfaden zeigt Ihnen, wie Sie den Agenten effektiv nutzen können.

Grundlegende Verwendung​

1. Dateierstellungsbefehle​

# Grundlegende Dateierstellung
/agent create file [dateiname]

# Datei in spezifischem Pfad erstellen
/agent create file [pfad/dateiname]

# Vorlage verwenden
/agent create file [dateiname] --template [vorlagenname]

2. Dateityp angeben​

# React-Komponente erstellen
/agent create file components/Button.tsx --type react

# API-Route erstellen
/agent create file api/users.ts --type api

# Testdatei erstellen
/agent create file tests/Button.test.tsx --type test

Erweiterte Funktionen​

1. Vorlagenverwendung​

// React-Komponenten-Vorlage
interface ComponentTemplate {
  name: string;
  props?: Record<string, any>;
  children?: boolean;
}

// Vorlage anwenden
/agent create file Button.tsx --template react-component --props "color:string,size:number"

2. Verzeichnisstruktur erstellen​

# Komplette Verzeichnisstruktur erstellen
/agent create structure src/components/Button

# Ergebnis:
# src/components/Button/
# ├── index.ts
# ├── Button.tsx
# ├── Button.test.tsx
# └── Button.module.css

Best Practices​

1. Namenskonventionen​

1. Komponentendateien
   - PascalCase verwenden (z.B. Button.tsx)
   - Funktionale Suffixe hinzufügen (z.B. ButtonContainer.tsx)

2. Hilfsdateien
   - camelCase verwenden (z.B. utils.ts)
   - Zweckbezogene Suffixe hinzufügen (z.B. dateUtils.ts)

3. Testdateien
   - Getestete Datei + .test (z.B. Button.test.tsx)
   - Snapshot-Tests mit .snapshot (z.B. Button.snapshot.tsx)

2. Dateiorganisation​

1. Komponentenstruktur
   - Komponentendatei
   - Stildatei
   - Testdatei
   - Indexdatei

2. Funktionale Struktur
   - Verzeichnis pro Funktion
   - Zugehörige Dateien gruppieren
   - Klare Hierarchie

Automatisierungsfunktionen​

1. Automatische Dateierstellung​

// Dateierstellungskonfiguration
interface FileConfig {
  name: string;
  type: string;
  template?: string;
  path?: string;
  options?: Record<string, any>;
}

// Automatisches Erstellungsskript
async function createFiles(configs: FileConfig[]): Promise<void> {
  for (const config of configs) {
    await agent.createFile(config);
  }
}

2. Vorlagenverwaltung​

// Vorlagendefinitionen
const templates = {
  react: {
    component: `
      import React from 'react';
      
      interface Props {
        // Props-Definition
      }
      
      export const {{name}}: React.FC<Props> = (props) => {
        return (
          // Komponenteninhalt
        );
      };
    `,
    test: `
      import { render, screen } from '@testing-library/react';
      import { {{name}} } from './{{name}}';
      
      describe('{{name}}', () => {
        it('renders correctly', () => {
          // Testinhalt
        });
      });
    `
  }
};

Fehlerbehebung​

1. Häufige Fehler​

1. Dateierstellungsfehler
   - Berechtigungen prüfen
   - Pfad validieren
   - Speicherplatz prüfen

2. Vorlagenfehler
   - Vorlagensyntax prüfen
   - Variablenersetzung prüfen
   - Pflichtfelder validieren

2. Debugging​

class FileCreator {
  // Debug-Protokollierung
  private logCreation(config: FileConfig): void {
    console.log('Dateierstellung:', {
      name: config.name,
      type: config.type,
      path: config.path
    });
  }

  // Fehlerbehandlung
  private handleError(error: Error): void {
    console.error('Dateierstellung fehlgeschlagen:', error);
    // Wiederherstellungslogik
  }
}

Leistungsoptimierung​

1. Batch-Verarbeitung​

class BatchFileCreator {
  // Batch-Erstellung
  async createBatch(files: FileConfig[]): Promise<void> {
    const batches = this.createBatches(files, 5);
    for (const batch of batches) {
      await Promise.all(batch.map(file => this.createFile(file)));
    }
  }

  // Batches erstellen
  private createBatches(files: FileConfig[], size: number): FileConfig[][] {
    return files.reduce((batches, file, index) => {
      const batchIndex = Math.floor(index / size);
      if (!batches[batchIndex]) {
        batches[batchIndex] = [];
      }
      batches[batchIndex].push(file);
      return batches;
    }, []);
  }
}

2. Caching​

class TemplateCache {
  private cache: Map<string, string> = new Map();

  // Vorlage abrufen
  async getTemplate(name: string): Promise<string> {
    if (this.cache.has(name)) {
      return this.cache.get(name);
    }
    const template = await this.loadTemplate(name);
    this.cache.set(name, template);
    return template;
  }
}

Sicherheitsüberlegungen​

1. Dateiberechtigungen​

class FilePermissionManager {
  // Berechtigungen prüfen
  async checkPermissions(path: string): Promise<boolean> {
    try {
      await fs.access(path, fs.constants.W_OK);
      return true;
    } catch {
      return false;
    }
  }

  // Berechtigungen setzen
  async setPermissions(path: string, mode: number): Promise<void> {
    await fs.chmod(path, mode);
  }
}

2. Eingabevalidierung​

class FileValidator {
  // Dateiname validieren
  validateFileName(name: string): boolean {
    return /^[a-zA-Z0-9-_]+$/.test(name);
  }

  // Pfad validieren
  validatePath(path: string): boolean {
    return !path.includes('..') && path.startsWith('/');
  }
}

Fazit​

Die Verwendung des KI-Agenten von Cursor zur Dateierstellung kann Ihren Entwicklungsprozess erheblich verbessern. Durch die Befolgung der Best Practices in diesem Leitfaden können Sie einen effizienten und konsistenten Dateierstellungsprozess etablieren.

Zusätzliche Ressourcen:

Letzte Aktualisierung: Februar 2025 - Dieser Leitfaden behandelt Cursor Version 0.43.