Mise en cache des builds en intégration continue (CI)

Pour améliorer les performances de build, Next.js enregistre un cache dans .next/cache qui est partagé entre les builds.

Pour tirer parti de ce cache dans les environnements d'intégration continue (CI), votre workflow CI devra être configuré pour persister correctement le cache entre les builds.

Si votre CI n'est pas configuré pour persister .next/cache entre les builds, vous pourriez voir une erreur No Cache Detected (Aucun cache détecté).

Voici quelques exemples de configurations de cache pour les principaux fournisseurs de CI :

Vercel

La mise en cache de Next.js est automatiquement configurée pour vous. Aucune action n'est requise de votre part.

CircleCI

Modifiez votre étape save_cache dans .circleci/config.yml pour inclure .next/cache :

steps:
  - save_cache:
      key: dependency-cache-{{ checksum "yarn.lock" }}
      paths:
        - ./node_modules
        - ./.next/cache

Si vous n'avez pas de clé save_cache, veuillez suivre la documentation de CircleCI sur la configuration du cache de build.

Travis CI

Ajoutez ou fusionnez ce qui suit dans votre .travis.yml :

cache:
  directories:
    - $HOME/.cache/yarn
    - node_modules
    - .next/cache

GitLab CI

Ajoutez ou fusionnez ce qui suit dans votre .gitlab-ci.yml :

cache:
  key: ${CI_COMMIT_REF_SLUG}
  paths:
    - node_modules/
    - .next/cache/

Netlify CI

Utilisez les Netlify Plugins avec @netlify/plugin-nextjs.

AWS CodeBuild

Ajoutez (ou fusionnez) ce qui suit dans votre buildspec.yml :

cache:
  paths:
    - 'node_modules/**/*' # Cache `node_modules` pour accélérer `yarn` ou `npm i`
    - '.next/cache/**/*' # Cache Next.js pour accélérer les rebuilds de l'application

GitHub Actions

En utilisant actions/cache de GitHub, ajoutez l'étape suivante dans votre fichier de workflow :

uses: actions/cache@v3
with:
  # Voir ici pour la mise en cache avec `yarn` https://github.com/actions/cache/blob/main/examples.md#node---yarn ou vous pouvez utiliser la mise en cache avec actions/setup-node https://github.com/actions/setup-node
  path: |
    ~/.npm
    ${{ github.workspace }}/.next/cache
  # Génère un nouveau cache lorsque les packages ou les fichiers sources changent.
  key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}
  # Si les fichiers sources ont changé mais pas les packages, reconstruisez à partir d'un cache précédent.
  restore-keys: |
    ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-

Bitbucket Pipelines

Ajoutez ou fusionnez ce qui suit dans votre bitbucket-pipelines.yml au niveau supérieur (même niveau que pipelines) :

definitions:
  caches:
    nextcache: .next/cache

Puis référencez-le dans la section caches de l'étape de votre pipeline :

- step:
    name: your_step_name
    caches:
      - node
      - nextcache

Heroku

En utilisant le cache personnalisé de Heroku, ajoutez un tableau cacheDirectories dans votre package.json au niveau supérieur :

"cacheDirectories": [".next/cache"]

Azure Pipelines

En utilisant la tâche Cache d'Azure Pipelines, ajoutez la tâche suivante à votre fichier yaml de pipeline quelque part avant la tâche qui exécute next build :

- task: Cache@2
  displayName: 'Cache .next/cache'
  inputs:
    key: next | $(Agent.OS) | yarn.lock
    path: '$(System.DefaultWorkingDirectory)/.next/cache'

Mise en cache des builds en intégration continue (CI)

On this page