1  // Solid.js with Tailwind CSS .cursorrules
 2  
 3  // Prefer functional components
 4  
 5  const preferFunctionalComponents = true;
 6  
 7  // Solid.js and Tailwind CSS best practices
 8  
 9  const solidjsTailwindBestPractices = [
10  "Use createSignal() for reactive state",
11  "Implement Tailwind CSS classes for styling",
12  "Utilize TypeScript's strict mode",
13  "Utilize @apply directive in CSS files for reusable styles",
14  "Implement responsive design using Tailwind's responsive classes",
15  "Use Tailwind's CSS in /src/styles.css for global styles",
16  "Implement dark mode using Tailwind's dark variant",
17  ];
18  
19  // Additional instructions
20  
21  const additionalInstructions = `
22  
23  1. Use .tsx extension for files with JSX
24  2. Implement strict TypeScript checks
25  3. Implement proper Tailwind CSS purging for production builds
26  4. Utilize TanStack Router for routing when applicable
27  5. Use type-safe context with createContext
28  6. Implement proper typing for event handlers
29  7. Follow TypeScript best practices and naming conventions
30  8. Use type assertions sparingly and only when necessary
31  9. Use Tailwind's @layer directive for custom styles
32  10. Implement utility-first CSS approach
33  11. Follow both Solid.js and Tailwind naming conventions
34  12. Use JIT (Just-In-Time) mode for faster development
35      `;