К основному содержанию
правило

nextjs-app-router-cursorrules-prompt-file — правило для Cursor

Правило для Cursor, которое задаёт агенту привычки Next.js App Router: серверные компоненты по умолчанию, файловый роутинг, отдельные файлы для загрузки и ошибок.

Установить в Cursor · Вручную: положить файлы Все способы и платформы ↓
.cursor/rules/nextjs-app-router-cursorrules-prompt-file.mdc
Открыть на GitHub

Что делает nextjs-app-router-cursorrules-prompt-file

Файл описывает набор практик для App Router и подкладывает их агенту как контекст. Внутри — список из семи пунктов: серверные компоненты по умолчанию, клиентские только когда без них не обойтись, файловый роутинг, layout.js для общих обёрток, loading.js для состояний загрузки, error.js для обработки ошибок, route handlers для API.

Дальше идёт структура папок: app/ с layout.js и page.js, рядом components/, lib/, styles/, отдельно public/. Дополнительные указания советуют TypeScript, метаданные для SEO, компонент Image, CSS Modules или Tailwind, error boundaries, соглашения об именах специальных файлов и переменные окружения для конфигурации.

В frontmatter стоит alwaysApply: false, а globs задан как **/*. Это значит, что правило не подключается само — его нужно привязать к проекту или вызвать вручную, иначе Cursor его не увидит. Для нового проекта на Pages Router советы про loading.js и route handlers просто не к чему применить.

Какие задачи решает

  • задать агенту серверные компоненты по умолчанию
  • разложить файлы по папкам app/, components/, lib/
  • добавить loading.js и error.js в маршруты
  • перевести API-роуты на route handlers
  • договориться об именах специальных файлов Next.js

Примеры запросов агенту

  • Создай страницу в app/dashboard/page.js по правилам App Router
  • Разбей этот компонент: серверная часть отдельно, клиентская только там, где нужны обработчики
  • Добавь loading.js и error.js для маршрута app/blog/[slug]

Как установить nextjs-app-router-cursorrules-prompt-file

Вручную: положить файлы

.cursor/rules/nextjs-app-router-cursorrules-prompt-file.mdc

Во frontmatter: description, globs, alwaysApply

По шагам, с командами для каждой платформы: Cursor rules: файлы .mdc, четыре режима и замена .cursorrules

Вопросы о nextjs-app-router-cursorrules-prompt-file

Как установить nextjs-app-router-cursorrules-prompt-file в Cursor?

Создайте файл .cursor/rules/nextjs-app-router-cursorrules-prompt-file.mdc в корне проекта и вставьте в него содержимое правила.

Что делает nextjs-app-router-cursorrules-prompt-file?

Задаёт агенту Cursor практики Next.js App Router: серверные компоненты по умолчанию, файловый роутинг, layout.js, loading.js, error.js и route handlers для API.

Правило применяется ко всем файлам автоматически?

Нет. В frontmatter указано alwaysApply: false, поэтому правило нужно подключить к проекту или вызвать вручную.

Исходный текст

nextjs-app-router-cursorrules-prompt-file.mdc · CC0-1.0
---
description: "Cursor rules for Next.js development with App Router integration."
globs: **/*
alwaysApply: false
---
// Next.js App Router .cursorrules

// Next.js App Router best practices

const nextjsAppRouterBestPractices = [
  "Use server components by default",
  "Implement client components only when necessary",
  "Utilize the new file-based routing system",
  "Use layout.js for shared layouts",
  "Implement loading.js for loading states",
  "Use error.js for error handling",
  "Utilize route handlers for API routes",
];

// Folder structure

const folderStructure = `
app/
  layout.js
  page.js
  components/
  lib/
  styles/
public/
`;

// Additional instructions

const additionalInstructions = `
1. Use TypeScript for type safety
2. Implement proper metadata for SEO
3. Utilize Next.js Image component for optimized images
4. Use CSS Modules or Tailwind CSS for styling
5. Implement proper error boundaries
6. Follow Next.js naming conventions for special files
7. Use environment variables for configuration
`;

© PatrickJS · CC0-1.0 · PatrickJS/awesome-cursorrules

Похожие правила IDE

Все правила IDE по теме «Фронтенд и UI» →
nextjs-app-router-fundamentals wsimmonds Скилл ведёт агента по Next.js App Router: перенос с Pages Router, вложенные layout, метаданные, динамические маршруты. Пригодится при переходе на app/. CX Codex +1 2 200установок nextjs-app-router giuseppe-trisciuoglio Даёт паттерны и примеры для Next.js 16+ с App Router: от Server Components до route.ts и кэширования. CX Codex +1 3 900установок nextjs-app-router-patterns Seth Hobson Помогает строить приложения на Next.js App Router: выбирать режим рендеринга, организовывать маршруты и получать данные. Подойдёт при миграции с Pages Router или работе с Server Components. CX Codex 32 529установок nextjs-app-architecture aurorascharff Скилл задаёт единую архитектуру App Router в Next.js 16: страницы только компонуют, данные читают фичи. Пригодится при старте проекта и при разборе чужого кода. CX Codex +1 485установок next-intl-app-router liuchiawei Настраивает next-intl с локалью в пути: конфиг, прокси, навигация и файлы сообщений. Пригодится, когда в проект добавляют второй язык. CX Codex +1 601установок nextjs-architecture-expert davila7 Субагент для Claude, который разбирает архитектуру Next.js: App Router, Server Components, миграцию и производительность. 4 935установок

Из того же набора68

nextjs-vercel-typescript-cursorrules-prompt-file Правило для Cursor, которое задаёт стиль кода и структуру проекта на Next.js с TypeScript, Vercel middleware и KV-базой. ★ 41 011звёзд репо nextjs-typescript-cursorrules-prompt-file Правило для Cursor задаёт стек Next.js с TypeScript и порядок работы агента: план, стиль кода, формат ответа. Пригодится, если вы пишете фронтенд на Next.js. ★ 41 011звёзд репо nextjs-tailwind-typescript-apps-cursorrules-prompt Правило для Cursor, которое настраивает ассистента на Next.js, Tailwind CSS и TypeScript. Оно задаёт порядок работы: сначала план в псевдокоде, потом код. ★ 41 011звёзд репо nextjs-react-typescript-cursorrules-prompt-file Правило для Cursor, которое задаёт агенту стиль кода в проектах на Next.js 14 App Router, React и TypeScript. ★ 41 011звёзд репо netlify-official-cursorrules-prompt-file Правило для Cursor, которое задаёт агенту официальные соглашения Netlify: типы функций, работа с окружением и запрет лишних CORS-заголовков. ★ 41 011звёзд репо nativescript-cursorrules-prompt-file Правило Cursor, которое задаёт агенту структуру проекта и стек для NativeScript: TypeScript, навигация, защищённое хранилище. ★ 41 011звёзд репо manifest-yaml-cursorrules-prompt-file Правило задаёт Cursor, как собирать лёгкий демо-бэкенд на Manifest: структура проекта, файл manifest/backend.yml и ограничения по сущностям. ★ 41 011звёзд репо laravel-php-83-cursorrules-prompt-file Правило для Cursor, которое ведёт агента по разработке пакетов Laravel: структура, стандарты кода, тесты и документация. ★ 41 011звёзд репо

Спонсоры проекта

Компании, которые помогают держать аналитику открытой