← Back to React Course | Chapter 1: Environment Setup & Tooling | Lesson 9 of 10

npm Scripts को समझना

npm scripts एक remote control पर labeled buttons जैसे हैं -- एक दबाएं और यह आपके project के लिए एक specific job run करता है।
Syntax
markup
{
  "scripts": {
    "scriptName": "command"
  }
}

npm run scriptName

scripts Section क्या करता है

package.json का scripts section common commands के लिए named shortcuts define करता है, जैसे "start": "vite" या "build": "vite build", ताकि आप पूरा underlying command type करने के बजाय npm run build type करें।

Note: Current project में उपलब्ध हर script list करने के लिए npm run (बिना script name के) run करें।
Warning: npm start और npm run start दोनों एक special case के रूप में काम करते हैं, लेकिन ज़्यादातर दूसरे custom scripts को explicit run keyword चाहिए: npm run build, npm build नहीं।

उदाहरण: Listing and Running npm Scripts

bash
$ npm run
Lifecycle scripts included in my-app:
  dev
    vite
  build
    vite build
  preview
    vite preview

$ npm run build
vite v5.0.0 building for production...
✓ 34 modules transformed.
dist/index.html
dist/assets/index-4f3a2b1c.js

⚠️ Run this in your own terminal or Node.js environment.

Common Scripts जो आप Use करेंगे

लगभग हर React project एक dev/start script (local dev server run करता है), एक build script (production bundle बनाता है), और अक्सर एक test script (test suite run करता है) के साथ ship होता है।

Note: एक unfamiliar project join करते समय सबसे पहले package.json का scripts section check करें -- यह exactly बताता है कि इसे कैसे run करना है।
Warning: npm run build run करना जब आपका मतलब dev server start करना था एक live preview नहीं खोलेगा -- यह बस files एक dist/ या build/ folder में लिखता है और exit हो जाता है।

उदाहरण: Common Scripts You'll Use

bash
npm run dev    # local dev server
npm run build  # production bundle
npm test       # run test suite

⚠️ Run this in your own terminal or Node.js environment.

अपना खुद का Script जोड़ना

आप scripts section में खुद एक custom entry जोड़ सकते हैं, जैसे "lint": "eslint src", और फिर इसे npm run lint से वैसे ही run कर सकते हैं।

Note: Custom script names कुछ भी हो सकते हैं -- वे बस एक shell command में mapped labels हैं।
Warning: एक custom script name जो किसी built-in npm command name से collide करता है unexpectedly behave कर सकता है -- names को distinct और descriptive रखें।

उदाहरण: Adding Your Own Script

bash
// package.json
{
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "lint": "eslint src"
  }
}

$ npm run lint
> [email protected] lint
> eslint src

src/App.jsx
  12:7  warning  'count' is assigned a value but never used  no-unused-vars

⚠️ Run this in your own terminal or Node.js environment.

Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the view already swaps in the hi_ translation fields (or blanks these out if untranslated), so this renders correctly for both languages without a lang_code check here. #}
आम गलतियां
  1. run keyword के बिना एक custom script run करना (start/test के लिए काम करता है लेकिन custom names के लिए नहीं)।
  2. कोई command मौजूद है यह मान लेने से पहले package.json का scripts section check न करना।
  3. यह realize किए बिना कि यह default behavior बदल देता है एक built-in script name (जैसे start) को overwrite करना।
चैप्टर सारांश
  • npm scripts package.json के scripts section में defined shortcuts हैं।
  • npm start और npm test को शब्द run के बिना run किया जा सकता है; custom scripts को npm run <name> चाहिए।
  • Common React scripts में start (dev server), build (production bundle), और test शामिल हैं।
  • आप linting या formatting जैसे tasks के लिए अपने खुद के custom scripts जोड़ सकते हैं।
ब्राउज़र सपोर्ट

Applicable नहीं -- npm scripts terminal में run होते हैं, browser में नहीं।

Login to run this code

C/C++/Java/PHP execution requires a free account. Your code is saved — you'll land right back in the editor after logging in.