paint-brush
כיצד לפרסם באופן אוטומטי את חבילת ה-NPM שלך באמצעות פעולות GitHubעל ידי@kingflamez
היסטוריה חדשה

כיצד לפרסם באופן אוטומטי את חבילת ה-NPM שלך באמצעות פעולות GitHub

על ידי Oluwole Adebiyi9m2024/12/20
Read on Terminal Reader

יותר מדי זמן; לקרוא

אוטומציה של תהליך פרסום חבילת npm שלך עם אינטגרציה ואספקה מתמשכת (CI/CD) מבטיחה שכל מהדורה עוברת בשער איכותי. במדריך זה, תלמד כיצד להגדיר CI/CD עבור חבילת npm פשוטה - מאמת אלפאנומרי. כל מהדורה חדשה של GitHub מפעילה בדיקות, מעדכנת את גרסת החבילה ומפרסמת אוטומטית חבילה נקייה.
featured image - כיצד לפרסם באופן אוטומטי את חבילת ה-NPM שלך באמצעות פעולות GitHub
Oluwole Adebiyi HackerNoon profile picture
0-item


אוטומציה של תהליך פרסום חבילת ה-npm שלך עם אינטגרציה ואספקה מתמשכת (CI/CD) מבטיחה שכל מהדורה עוברת דרך שער איכותי - חבילת הבדיקה שלך - לפני הפרסום. יחד עם זאת, אתה יכול לשלוט במה בדיוק יגיע לחבילה הסופית שפורסמה על ידי אי הכללת קובצי בדיקה. במדריך זה, תלמדו כיצד להגדיר CI/CD עבור חבילת npm פשוטה - אימות אלפאנומרי - כך שכל מהדורה חדשה של GitHub מפעילה בדיקות, מעדכנת את גרסת החבילה ומפרסמת אוטומטית חבילה נקייה ל-npm.


למה להפוך את פרסום npm לאוטומטי?

פרסום ידני npm יכול להיות גוזל זמן ונוטה לשגיאות, במיוחד כשהפרויקט שלך גדל וצובר תורמים. על ידי אוטומציה של התהליך, אתה יכול:

  • ודא איכות: הפעל אוטומטית בדיקות לפני הפרסום. אם הבדיקות נכשלות, הגרסה החדשה לא תשוחרר.
  • גירסה עקבית: גרסת החבילה שפורסמה תמיד תואמת לתג השחרור.
  • שיתוף פעולה ללא חיכוך: תורמים מגישים קוד, אתה יוצר מהדורה, והצינור עושה את השאר - לא נדרשות הרשאות npm מיוחדות.


דרישות מוקדמות

  1. Node.js & npm:
    • לחץ כאן אם לא מותקנים אצלך NodeJS ו-NPM.
    • אשר את ההתקנה על ידי הפעלת הקוד למטה בטרמינל שלך.
 node -v npm -v
  1. חשבון ומאגר GitHub:
    • אתה צריך מאגר GitHub כדי לאחסן קוד ולהפעיל את פעולות GitHub.
  2. חשבון NPM ואסימון גישה:
    • הירשם או התחבר ב- npmjs.com והפק אסימון גישה.
    • הוסף את אסימון הגישה כסוד במאגר GitHub שלך לפרסום אוטומטי.


שלב 1: הגדר את הפרויקט

אנו ניצור חבילת alphanumeric-validator פשוטה שמייצאת פונקציה הבודקת אם מחרוזת היא אלפאנומרית.

  1. אתחול הפרויקט

     mkdir alphanumeric-validator cd alphanumeric-validator npm init -y
  2. עדכן package.json לפי הצורך. עבור alphanumeric-validator , זה ייראה כך.

 { "name": "alphanumeric-validator", "version": "1.0.0", "description": "Validates if a string is alphanumeric", "main": "index.js", "scripts": { "test": "jest" }, "keywords": ["alphanumeric", "validator"], "author": "Your Name", "license": "ISC" }
  1. יישם את האימות
 // index.js function isAlphaNumeric(str) { return /^[a-z0-9]+$/i.test(str); } module.exports = isAlphaNumeric;


שלב 2: הוסף והפעל בדיקות באופן מקומי

הבדיקה מבטיחה שלא תפרסם קוד שבור.

  1. התקן את Jest

     npm install --save-dev jest
  2. צור קובץ בדיקה

     mkdir tests
  3. הדבק את הקוד למטה בקובץ tests/index.text.js .

     // tests/index.test.js const isAlphaNumeric = require('../index'); test('valid alphanumeric strings return true', () => { expect(isAlphaNumeric('abc123')).toBe(true); }); test('invalid strings return false', () => { expect(isAlphaNumeric('abc123!')).toBe(false); });
  4. הפעל בדיקות

     npm test 


המבחן רץ בהצלחה

מבחנים עוברים? גָדוֹל. כעת, נוודא שהבדיקות הללו פועלות ב-CI לפני הפרסום.


שלב 3: אל תכלול מודולי צומת מ-Git

לפני הפרסום ב-Github, אתה רוצה להוציא את node_modules . אינך רוצה לחייב node_modules לבקרת גרסה, מכיוון שהוא מכיל מספר רב של קבצים שניתן ליצור מחדש על ידי npm install .


צור קובץ .gitignore בבסיס הפרויקט שלך:

 echo "node_modules" >> .gitignore

זה מבטיח ש- node_modules לא יעוקב על ידי git ולא יידחפו למאגר שלך.

שלב 4: אל תכלול בדיקות מהחבילה שפורסמה

בעוד שתפעיל בדיקות במהלך CI, אינך רוצה שקובצי הבדיקה ייכללו בחבילת ה-npm שפורסמה. זה שומר על ניקיון החבילה, בעלת גודל חבילה קטן ומבטיח שרק הקבצים הדרושים נשלחים למשתמשים.

צור קובץ .npmignore בתיקיית השורש והוסף את שמות קבצי הבדיקה.

 // .npmignore __tests__ *.test.js // captures all files in the directory with a .test.js extension


זה מבטיח שקובצי הבדיקה אינם כלולים בעת הפעלת npm publish .

שלב 5: ארח את הקוד שלך ב-GitHub

  1. צור מאגר GitHub חדש:

יצירת מאגר חדש


נוצר מאגר, עדיין אין קוד


  1. לחץ על הקוד שלך

     git init git add . git commit -m "Initial commit" git remote add origin [email protected]:YOUR_USERNAME/alphanumeric-validator.git git push -u origin main 


דוחף קוד מקומי ל-Github


נוצר מאגר, קוד מקומי הועלה כעת


שלב 5: פרסום ידני ראשוני ל-npm

  • לפני התחלת האוטומציה, אשר שניתן לפרסם את החבילה שלך - ראה כאן.
  • לאחר מכן, הוסף את הדגל --access public כדי להפוך את החבילה שלך לציבורית ונגישה למשתמשים.


 npm login npm publish --access public 


פרסום ל-npm מהמסוף


פורסם אלפאנומרי-מאגד

שלב 6: הגדרת זרימת העבודה של GitHub Actions

עליך להגדיר זרימת עבודה שפועלת בכל אירוע שחרור כך שכאשר אתה יוצר גרסה חדשה (כמו v1.0.1 ):

  • זרימת העבודה בודקת את הקוד שלך.
  • מתקין תלות.
  • מפעיל בדיקות כדי להבטיח איכות.
  • מעדכן package.json לגרסה החדשה מתג השחרור.
  • מפרסם את החבילה המעודכנת ל-npm מבלי לכלול קבצי בדיקה.


קובץ זרימת העבודה

צור .github/workflows/publish.yml :


 name: Publish Package to npm # Trigger this workflow whenever a new release is published on: release: types: [published] # Grant write permissions to the repository contents so we can push version updates permissions: contents: write jobs: publish: runs-on: ubuntu-latest steps: # Step 1: Check out the repository's code at the default branch # This makes your code available for subsequent steps like installing dependencies and running tests. - uses: actions/checkout@v4 with: token: ${{ secrets.GITHUB_TOKEN }} ref: ${{ github.event.repository.default_branch }} # Step 2: Set up a Node.js environment (Node 20.x) and configure npm to use the official registry # This ensures we have the right Node.js version and a proper registry URL for installs and publishing. - name: Setup Node.js uses: actions/setup-node@v4 with: node-version: '20.x' registry-url: 'https://registry.npmjs.org' # Step 3: Install dependencies using npm ci # This ensures a clean, reproducible installation based on package-lock.json. - name: Install dependencies run: npm ci # Step 4: Run your test suite (using the "test" script from package.json) # If tests fail, the workflow will stop here and not publish a broken version. - name: Run tests run: npm test # Step 5: Update package.json to match the release tag # The release tag (eg, v1.0.1) is extracted, and npm version sets package.json version accordingly. # The --no-git-tag-version flag ensures npm doesn't create its own tags. # This step keeps package.json's version aligned with the release tag you just created. - name: Update package.json with release tag run: | TAG="${{ github.event.release.tag_name }}" echo "Updating package.json version to $TAG" npm version "$TAG" --no-git-tag-version # Step 6: Commit and push the updated package.json and package-lock.json back to the repo # This ensures your repository always reflects the exact version published. # We use the GITHUB_TOKEN to authenticate and the granted write permissions to push changes. - name: Commit and push version update run: | TAG="${{ github.event.release.tag_name }}" git config user.name "github-actions" git config user.email "[email protected]" git add package.json package-lock.json git commit -m "Update package.json to version $TAG" git push origin ${{ github.event.repository.default_branch }} env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} # Step 7: Publish the new version to npm # The NODE_AUTH_TOKEN is your npm access token stored as a secret. # npm publish --access public makes the package available to anyone on npm. - name: Publish to npm run: npm publish --access public env: NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}


הוספת אסימון ה-NPM שלך ל-GitHub


יצירת אסימון גישה ל-NPM


  • אתה תופנה לדף האסימונים, שם תוכל להעתיק את האסימון.

  • עבור אל הגדרות > סודות ומשתנים > פעולות במאגר GitHub שלך.

  • לחץ על סוד מאגר חדש והוסף NPM_TOKEN .


שלב 7: יצירת מהדורה חדשה

נניח שאתה רוצה להוסיף README.md לגרסה v1.0.1 , ודחפת אותו:

  1. טיוטה של מהדורה חדשה:
    • עבור לקטע מהדורות ברפו של GitHub שלך. [ https://github.com/username/repo/releases ]
    • לחץ על טיוטה של מהדורה חדשה .
    • הגדר את "גרסת התג" לגרסה 1.0.1.
    • לחץ על פרסם גרסה .


  1. זרימת עבודה מופעלת: אירוע השחרור מופעל. זרימת העבודה,
    • בודק את הקוד.
    • מתקין תלות.
    • מפעיל בדיקות. אם הבדיקות נכשלות, העבודה נעצרת והחבילה לא תפורסם.
    • אם הבדיקות עוברות, הוא מעדכן את package.json ל 1.0.1 .
    • מפרסם את גרסת 1.0.1 ל-npm, לא כולל קבצי בדיקה.


  1. אמת ב-npm: לאחר רגע, בקר בדף חבילת npm שלך כדי לראות את הגרסה החדשה בזמן אמת.



מַסְקָנָה

שילוב פעולות GitHub לתוך זרימת העבודה של פרסום npm שלך מקים צינור CI/CD נהדר. עם כל מהדורה חדשה, סדרה מקיפה של בדיקות מופעלת, package.json מתעדכן בגרסה הנכונה, וחבילה יעילה מתפרסמת ל-npm - ללא קבצים מיותרים כמו בדיקות.

גישה זו חוסכת זמן, מפחיתה טעויות אנוש ומשפרת את המהימנות של המהדורות שלך, מה שמקל על התורמים לראות את עבודתם מופעלת בצורה חלקה.

מהדורת GitHub יחידה היא כעת כל מה שנדרש כדי לשלוח חבילה שנבדקה במלואה עם גרסה נכונה לרישום npm.