All databases

Cursor rule

Qwik Basic Cursorrules Prompt File

Cursor rules for Qwik development with TypeScript and Vite integration.

Prefer functional components

js
const preferFunctionalComponents = true;

Qwik.js best practices

js
const qwikBestPractices = [
  "Use $ suffix for lazy-loaded functions",
  "Utilize useSignal() for reactive state",
  "Implement useStore() for complex state objects",
  "Use useResource$() for data fetching",
  "Implement useTask$() for side effects",
  "Utilize useVisibleTask$() for browser-only code",
  "Leverage TypeScript for type safety",
  "Use Vite's fast HMR for development",
];

Folder structure

js
const folderStructure = `
src/
  components/
  routes/
  global.css
  root.tsx
  entry.ssr.tsx
public/
vite.config.ts
tsconfig.json
`;

Additional instructions

js
const additionalInstructions = `
1. Use TypeScript for all .ts and .tsx files
2. Implement proper error boundaries
3. Utilize Qwik City for routing when applicable
4. Use Qwik's built-in optimization features
5. Implement lazy-loading for improved performance
6. Follow Qwik's naming conventions and best practices
7. Use server$ for server-side code execution
8. Leverage Vite plugins for optimized builds
`;

More Frontend rules

Frequently asked questions

What is the Qwik Basic Cursorrules Prompt File Cursor rule?

Cursor rules for Qwik development with TypeScript and Vite integration. It is a Frontend rule, stored as qwik-basic-cursorrules-prompt-file.mdc.

How do I use the Qwik Basic Cursorrules Prompt File rule in Cursor?

Copy the rule from this page and save it as qwik-basic-cursorrules-prompt-file.mdc in your project's .cursor/rules folder, or paste it into Cursor's project rules settings.