К основному содержанию
скилл CX Codex GP ChatGPT официальный · OpenAI

next-upgrade — скилл для Codex: обновление Next.js по гайдам

Проводит проект через мажорные обновления Next.js: читает текущую версию, тянет официальные гайды и запускает кодмоды.

Установить в Codex · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add openai/plugins --skill next-upgrade -a codex
Открыть на GitHub

Что делает next-upgrade

Скилл смотрит в package.json, находит текущую версию Next.js и связанные зависимости вроде React и React DOM. Дальше он забирает официальную документацию по обновлению — отдельно страницу кодмодов и гайд под нужную версию — и решает, какие шаги миграции вообще применимы к вашему проекту.

Для больших скачков путь разбивается на промежуточные: 13 → 14 → 15, а не одним прыжком. Сначала идут кодмоды, которые закрывают часть ломающих изменений автоматически: npx @next/codemod@latest <transform> <path>. Среди трансформов есть next-async-request-api, next-request-geo-ip и next-dynamic-access-named-export. Потом обновляются сами пакеты — npm install next@latest react@latest react-dom@latest — и типы, если проект на TypeScript.

Кодмоды закрывают не всё. Асинхронные параметры в v15, правки в next.config.js и удаляемые устаревшие возможности придётся разбирать руками по гайду. В конце скилл предлагает прогнать npm run build и npm run dev — без этого обновление не проверить.

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

  • перевести проект со старой мажорной версии Next.js на новую
  • закрыть ломающие изменения кодмодами вместо ручной правки
  • понять, какие шаги миграции касаются именно вашего проекта
  • обновить React и React DOM вместе с Next.js
  • проверить сборку после апгрейда

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

  • Обнови Next.js до последней версии по официальному гайду
  • Прогони кодмоды для перехода на Next.js 15
  • Мигрируй проект с 13 на 15 постепенно, по шагам

Как установить next-upgrade

1Через Skills CLI (Vercel)

npx skills add openai/plugins --skill next-upgrade -a codex

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

.agents/skills/next-upgrade/SKILL.md

Для всех проектов — ~/.agents/skills/

По шагам, с командами для каждой платформы: Скиллы Codex: как установить, где лежат и как вызвать

Вопросы о next-upgrade

Как установить next-upgrade в Codex?

Через npx skills add openai/plugins --skill next-upgrade -a codex. Файл скилла окажется по пути .agents/skills/next-upgrade/SKILL.md.

Что делает next-upgrade?

Ведёт проект через обновление Next.js: определяет текущую версию, подтягивает официальные гайды и кодмоды, обновляет зависимости и напоминает про проверку сборки.

Можно ли перепрыгнуть сразу через несколько мажорных версий?

Скилл советует идти пошагово: 13 → 14 → 15. Так проще отследить, какое изменение что сломало.

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

SKILL.md · Apache-2.0
---
name: next-upgrade
description: Upgrade Next.js to the latest version following official migration guides and codemods. Use when upgrading Next.js versions, running codemods, or migrating between major releases.
metadata:
  priority: 6
  docs:
    - "https://nextjs.org/docs/app/guides/upgrading"
    - "https://nextjs.org/docs/app/guides/upgrading/codemods"
  pathPatterns:
    - 'next.config.*'
    - 'package.json'
  bashPatterns:
    - '\bnpx\s+@next/codemod\b'
    - '\bnpm\s+(install|i|add)\s+[^\n]*\bnext@'
    - '\bpnpm\s+(install|i|add)\s+[^\n]*\bnext@'
    - '\bbun\s+(install|i|add)\s+[^\n]*\bnext@'
    - '\byarn\s+add\s+[^\n]*\bnext@'
  promptSignals:
    phrases:
      - "upgrade next"
      - "upgrade nextjs"
      - "migrate next"
      - "update next.js"
      - "next.js upgrade"
      - "nextjs migration"
      - "next codemod"
    allOf:
      - [upgrade, next]
      - [migrate, next]
      - [update, nextjs]
    anyOf:
      - "breaking changes"
      - "codemod"
      - "migration guide"
      - "version upgrade"
    noneOf: []
    minScore: 6
---

# Upgrade Next.js

Upgrade the current project to the latest Next.js version following official migration guides.

## Instructions

1. **Detect current version**: Read `package.json` to identify the current Next.js version and related dependencies (React, React DOM, etc.)

2. **Fetch the latest upgrade guide**: Use WebFetch to get the official upgrade documentation:
   - Codemods: https://nextjs.org/docs/app/guides/upgrading/codemods
   - Version-specific guides (adjust version as needed):
     - https://nextjs.org/docs/app/guides/upgrading/version-16
     - https://nextjs.org/docs/app/guides/upgrading/version-15
     - https://nextjs.org/docs/app/guides/upgrading/version-14

3. **Determine upgrade path**: Based on current version, identify which migration steps apply. For major version jumps, upgrade incrementally (e.g., 13 → 14 → 15).

4. **Run codemods first**: Next.js provides codemods to automate breaking changes:
   ```bash
   npx @next/codemod@latest <transform> <path>
   ```
   Common transforms:
   - `next-async-request-api` - Updates async Request APIs (v15)
   - `next-request-geo-ip` - Migrates geo/ip properties (v15)
   - `next-dynamic-access-named-export` - Transforms dynamic imports (v15)

5. **Update dependencies**: Upgrade Next.js and peer dependencies together:
   ```bash
   npm install next@latest react@latest react-dom@latest
   ```

6. **Review breaking changes**: Check the upgrade guide for manual changes needed:
   - API changes (e.g., async params in v15)
   - Configuration changes in `next.config.js`
   - Deprecated features being removed

7. **Update TypeScript types** (if applicable):
   ```bash
   npm install @types/react@latest @types/react-dom@latest
   ```

8. **Test the upgrade**:
   - Run `npm run build` to check for build errors
   - Run `npm run dev` and test key functionality

© Vercel Labs · Apache-2.0 · openai/plugins

Похожие скиллы

Всё по теме «Фронтенд и UI» →
chakra-ui-migrate chakra-ui Скилл ведёт миграцию проекта с Chakra UI v2 на v3 по шагам. Он помогает удалить старые пакеты, запустить официальный кодемод, обновить провайдер и переписать устаревшие пропсы. CX Codex +1 1 800установок next-cache-components-adoption vercel Включает Cache Components в Next.js и помогает разобрать ошибки блокирующего пререндеринга. Нужен при переходе на cacheComponents: true. CX Codex +1 21 300установок cra-to-next-migration community Помогает перенести проекты с Create React App на Next.js 16+. Скилл переводит маршруты React Router в App Router, меняет переменные окружения и внедряет Server Components. CX Codex +1 900установок update assistant-ui Обновляет существующее приложение на assistant-ui до актуальных версий AI SDK v7 и assistant-ui 0.15.x, применяя нужные миграции. Пригодится, когда после апдейта посыпались ошибки типов или пропали хуки. CX Codex +1 5 900установок next-best-practices pedronauck Скилл с набором правил Next.js: файловые конвенции, границы RSC, async API, метаданные, обработка ошибок. Пригодится, когда агент пишет или ревьюит код на Next.js. CX Codex +1 383установок next-dev-loop vercel Скилл проверяет, что правка в Next.js реально работает в запущенном приложении, а не только компилируется. Нужен при разработке через next dev. CX Codex +1 22 200установок

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

Весь набор →
build-report Собирает аналитические отчёты с выводами, таблицами и визуализациями для руководителей, продакт-менеджеров или технических команд. CX Codex GP ChatGPT 4установок define-security-policy Скилл помогает составить, проверить или обновить файлы SECURITY.md, чтобы задать границы проверок сканера Codex Security. CX Codex GP ChatGPT 4установок sandbox-sdk Скилл описывает работу с Cloudflare Sandbox SDK: запуск команд и кода в изолированной среде, операции с файлами и preview URL. Пригодится для исполнения кода через Cloudflare Workers. CX Codex GP ChatGPT 4установок circleci-cli Скилл помогает управлять пайплайнами CircleCI через терминальную утилиту circleci. Пригодится для проверки статусов, валидации конфигов и точечного перезапуска сборок. CX Codex GP ChatGPT 4установок remotion-studio Запускает Remotion Studio и даёт агенту URL для предпросмотра видео в браузере. Нужен при проверке результата рендера. CX Codex GP ChatGPT 3установок remotion-saas Помогает собрать приложение с видео на Remotion: от простой формы с рендером до редактора. Пригодится, если делаете SaaS с генерацией видео. CX Codex GP ChatGPT 3установок remotion-multimedia Скилл помогает агенту работать с Mediabunny в браузере: получать длительность аудио и видео, а также размеры видео. CX Codex GP ChatGPT 3установок share Разворачивает рабочий прототип через выбранный инструмент и возвращает ссылку для доступа. Подходит, когда цель деплоя уже определена. CX Codex GP ChatGPT 3установок

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

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