Настройка кэширования сборок в системе непрерывной интеграции (CI)
Для повышения производительности сборки Next.js сохраняет кэш в .next/cache
, который используется между сборками.
Чтобы использовать этот кэш в средах Continuous Integration (CI), необходимо настроить рабочий процесс CI для правильного сохранения кэша между сборками.
Если ваш CI не настроен на сохранение
.next/cache
между сборками, вы можете увидеть ошибку No Cache Detected.
Ниже приведены примеры конфигураций кэширования для распространённых CI-провайдеров:
Vercel
Кэширование Next.js настраивается автоматически. Вам не требуется предпринимать никаких действий. Если вы используете Turborepo на Vercel, узнайте больше здесь.
CircleCI
Измените шаг save_cache
в .circleci/config.yml
, включив .next/cache
:
steps:
- save_cache:
key: dependency-cache-{{ checksum "yarn.lock" }}
paths:
- ./node_modules
- ./.next/cache
Если у вас нет ключа save_cache
, следуйте документации CircleCI по настройке кэширования сборок.
Travis CI
Добавьте или объедините следующее в ваш .travis.yml
:
cache:
directories:
- $HOME/.cache/yarn
- node_modules
- .next/cache
GitLab CI
Добавьте или объедините следующее в ваш .gitlab-ci.yml
:
cache:
key: ${CI_COMMIT_REF_SLUG}
paths:
- node_modules/
- .next/cache/
Netlify CI
Используйте Netlify Plugins с @netlify/plugin-nextjs
.
AWS CodeBuild
Добавьте (или объедините) следующее в ваш buildspec.yml
:
cache:
paths:
- 'node_modules/**/*' # Кэшировать `node_modules` для ускорения `yarn` или `npm i`
- '.next/cache/**/*' # Кэшировать Next.js для ускорения пересборки приложения
GitHub Actions
Используя actions/cache от GitHub, добавьте следующий шаг в ваш рабочий файл:
uses: actions/cache@v4
with:
# См. примеры кэширования для `yarn`, `bun` и других менеджеров пакетов https://github.com/actions/cache/blob/main/examples.md или используйте кэширование через actions/setup-node https://github.com/actions/setup-node
path: |
~/.npm
${{ github.workspace }}/.next/cache
# Генерировать новый кэш при изменении пакетов или исходных файлов.
key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}
# Если исходные файлы изменились, но пакеты нет, пересобирать из предыдущего кэша.
restore-keys: |
${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-
Bitbucket Pipelines
Добавьте или объедините следующее в ваш bitbucket-pipelines.yml
на верхнем уровне (на том же уровне, что и pipelines
):
definitions:
caches:
nextcache: .next/cache
Затем укажите это в разделе caches
шага вашего пайплайна:
- step:
name: your_step_name
caches:
- node
- nextcache
Heroku
Используя custom cache от Heroku, добавьте массив cacheDirectories
в ваш корневой package.json:
"cacheDirectories": [".next/cache"]
Azure Pipelines
Используя Cache task от Azure Pipelines, добавьте следующую задачу в ваш yaml-файл пайплайна перед задачей, выполняющей next build
:
- task: Cache@2
displayName: 'Кэширование .next/cache'
inputs:
key: next | $(Agent.OS) | yarn.lock
path: '$(System.DefaultWorkingDirectory)/.next/cache'
Jenkins (Pipeline)
Используя плагин Job Cacher для Jenkins, добавьте следующий шаг сборки в ваш Jenkinsfile
там, где вы обычно запускаете next build
или npm install
:
stage("Восстановление npm пакетов") {
steps {
// Записывает lock-файл в кэш на основе хэша GIT_COMMIT
writeFile file: "next-lock.cache", text: "$GIT_COMMIT"
cache(caches: [
arbitraryFileCache(
path: "node_modules",
includes: "**/*",
cacheValidityDecidingFile: "package-lock.json"
)
]) {
sh "npm install"
}
}
}
stage("Сборка") {
steps {
// Записывает lock-файл в кэш на основе хэша GIT_COMMIT
writeFile file: "next-lock.cache", text: "$GIT_COMMIT"
cache(caches: [
arbitraryFileCache(
path: ".next/cache",
includes: "**/*",
cacheValidityDecidingFile: "next-lock.cache"
)
]) {
// то есть `next build`
sh "npm run build"
}
}
}