Solidjs TypeScript

Cursor-Regel für SolidJS mit TypeScript: typisierte Signals, Props und Komponenten.

Original-Beschreibung der Autoren: Cursor rules for Solid.js development with TypeScript integration.

Die Regel

---
description: "Cursor rules for Solid.js development with TypeScript integration."
globs: **/*
alwaysApply: false
---
// Solid.js with TypeScript .cursorrules

// Prefer functional components

const preferFunctionalComponents = true;

// Solid.js and TypeScript best practices

const solidjsTypeScriptBestPractices = [
  "Use createSignal<T>() for typed reactive state",
  "Implement proper type definitions for components",
  "Utilize TypeScript's strict mode",
  "Use type inference where possible",
  "Implement interfaces for complex prop types",
  "Utilize utility types provided by Solid.js",
];

// Folder structure

const folderStructure = `
src/
  components/
  pages/
  utils/
  types/
  App.tsx
  index.tsx
public/
  index.html
tsconfig.json
`;

// Additional instructions

const additionalInstructions = `
1. Use .tsx extension for files with JSX
2. Implement strict TypeScript checks
3. Utilize Solid Router with proper typing
4. Use type-safe context with createContext
5. Implement proper typing for event handlers
6. Follow TypeScript best practices and naming conventions
7. Use type assertions sparingly and only when necessary
`;

So nutzt du sie

Die Regel kopieren (Button oben) oder als Datei herunterladen und im Projekt unter .cursor/rules/ ablegen — Cursor lädt sie beim nächsten Start automatisch. Ältere Cursor-Versionen lesen alternativ eine einzelne .cursorrules-Datei im Projektstamm; dort einfach den Regel-Text ohne den Kopfblock zwischen den ----Zeilen einfügen.

Der Regel-Text ist englisch — Cursor versteht ihn unabhängig von der Sprache, in der Sie mit dem Editor chatten.

Im Detail

Diese Regel ergänzt SolidJS um TypeScript-Konventionen: typisierte Signals (z. B. createSignal), typisierte Props-Interfaces für Komponenten sowie korrekte Typisierung von Event-Handlern in JSX. Der Vorteil gegenüber der Basic-Regel liegt in weniger Laufzeitfehlern durch fehlende oder falsche Typen, gerade bei komplexeren Komponentenhierarchien mit vielen Props. Sinnvoll für Teams, die in TypeScript-Projekten arbeiten und von Cursor typsicheren statt lose typisierten SolidJS-Code erwarten. Für reine JavaScript-Projekte ohne TypeScript ist die Basic-Regel der passendere Einstieg.

Praxis-Tipp

Lassen Sie sich z. B. eine Komponente mit typisiertem Props-Interface für Titel und optionalen Klick-Handler generieren.

Lizenz & Quelle

• Lizenz: CC0 1.0
• Quelle: PatrickJS/awesome-cursorrules (GitHub)

Lade …