التكامل المستمر (CI) - تخزين البناء المؤقت
لتحسين أداء البناء، يحفظ Next.js ذاكرة تخزين مؤقت في .next/cache يتم مشاركتها بين عمليات البناء المختلفة.
للاستفادة من هذه الذاكرة المؤقتة في بيئات التكامل المستمر (CI)، ستحتاج إلى تكوين سير العمل في CI الخاص بك للحفاظ على الذاكرة المؤقتة بشكل صحيح بين عمليات البناء.
إذا لم يتم تكوين CI الخاص بك للحفاظ على
.next/cacheبين عمليات البناء، قد تظهر لك رسالة خطأ No Cache Detected.
فيما يلي بعض أمثلة تكوينات الذاكرة المؤقتة لمزودي CI الشائعين:
Vercel
يتم تكوين ذاكرة التخزين المؤقت لـ Next.js تلقائيًا لك. لا يلزمك اتخاذ أي إجراء.
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/cacheGitLab CI
أضف أو ادمج ما يلي في ملف .gitlab-ci.yml:
cache:
key: ${CI_COMMIT_REF_SLUG}
paths:
- node_modules/
- .next/cache/Netlify CI
استخدم إضافات Netlify مع @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` https://github.com/actions/cache/blob/main/examples.md#node---yarn أو يمكنك الاستفادة من التخزين المؤقت مع 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 في خط أنابيبك:
- step:
name: your_step_name
caches:
- node
- nextcacheHeroku
باستخدام ذاكرة التخزين المؤقت المخصصة من Heroku، أضف مصفوفة cacheDirectories في ملف package.json الرئيسي:
"cacheDirectories": [".next/cache"]Azure Pipelines
باستخدام مهمة التخزين المؤقت من 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("Restore npm packages") {
steps {
// كتابة ملف قفل في الذاكرة المؤقتة بناءً على تجزئة 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("Build") {
steps {
// كتابة ملف قفل في الذاكرة المؤقتة بناءً على تجزئة 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"
}
}
}