构建你的应用部署持续集成 (CI) 构建缓存

持续集成 (CI) 构建缓存

为了提高构建性能，Next.js 会将缓存保存到 .next/cache，该缓存将在构建之间共享。

要在持续集成 (CI) 环境中利用此缓存，需要配置 CI 工作流程以在构建之间正确持久化缓存。

如果你的 CI 未配置为在构建之间持久化 .next/cache，你可能会看到未检测到缓存错误。

以下是一些常见 CI 提供商的缓存配置示例

Vercel

Next.js 缓存会自动为你配置。你无需执行任何操作。如果你在 Vercel 上使用 Turborepo，请在此处了解更多信息。

CircleCI

在 .circleci/config.yml 中编辑你的 save_cache 步骤以包含 .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 插件和 @netlify/plugin-nextjs。

AWS CodeBuild

cache:
  paths:
    - 'node_modules/**/*' # Cache `node_modules` for faster `yarn` or `npm i`
    - '.next/cache/**/*' # Cache Next.js for faster application rebuilds

GitHub Actions

使用 GitHub 的 actions/cache，在您的工作流文件中添加以下步骤

uses: actions/cache@v4
with:
  # See here for caching with `yarn` https://github.com/actions/cache/blob/main/examples.md#node---yarn or you can leverage caching with actions/setup-node https://github.com/actions/setup-node
  path: |
    ~/.npm
    ${{ github.workspace }}/.next/cache
  # Generate a new cache whenever packages or source files change.
  key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}
  # If source files changed but packages didn't, rebuild from a prior cache.
  restore-keys: |
    ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-

Bitbucket Pipelines

将以下内容添加到您的 bitbucket-pipelines.yml 文件的顶层（与 pipelines 同级）

definitions:
  caches:
    nextcache: .next/cache

然后在您管道 step 的 caches 部分引用它

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

Heroku

使用 Heroku 的自定义缓存，在您顶层的 package.json 文件中添加一个 cacheDirectories 数组

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

Azure Pipelines

使用 Azure Pipelines 的缓存任务，在您管道 yaml 文件中执行 next build 任务之前的某个位置添加以下任务

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

Jenkins (Pipeline)

使用 Jenkins 的 Job Cacher 插件，在您的 Jenkinsfile 中添加以下构建步骤，通常您会在其中运行 next build 或 npm install

stage("Restore npm packages") {
    steps {
        // Writes lock-file to cache based on the GIT_COMMIT hash
        writeFile file: "next-lock.cache", text: "$GIT_COMMIT"
 
        cache(caches: [
            arbitraryFileCache(
                path: "node_modules",
                includes: "**/*",
                cacheValidityDecidingFile: "package-lock.json"
            )
        ]) {
            sh "npm install"
        }
    }
}
stage("Build") {
    steps {
        // Writes lock-file to cache based on the GIT_COMMIT hash
        writeFile file: "next-lock.cache", text: "$GIT_COMMIT"
 
        cache(caches: [
            arbitraryFileCache(
                path: ".next/cache",
                includes: "**/*",
                cacheValidityDecidingFile: "next-lock.cache"
            )
        ]) {
            // aka `next build`
            sh "npm run build"
        }
    }
}

这有帮助吗？