ग्रंट - स्थापित करना

यह अध्याय चरण-दर-चरण प्रक्रिया प्रदान करता है कि आपके सिस्टम पर ग्रंट को कैसे स्थापित किया जाए।

ग्रन्ट के लिए सिस्टम आवश्यकताएँ

  • Operating System - क्रॉस-प्लेटफॉर्म

  • Browser Support - IE (इंटरनेट एक्सप्लोरर 8+), फ़ायरफ़ॉक्स, गूगल क्रोम, सफारी, ओपेरा

ग्रंट की स्थापना

Step 1- हमें ग्रंट को चलाने के लिए NodeJs की आवश्यकता है। NodeJs डाउनलोड करने के लिए, लिंक खोलेंhttps://nodejs.org/en/, आप नीचे दिखाए गए अनुसार एक स्क्रीन देखेंगे -

ज़िप फ़ाइल का नवीनतम सुविधाएँ संस्करण डाउनलोड करें ।

Step 2- इसके बाद, अपने कंप्यूटर पर NodeJs स्थापित करने के लिए सेटअप चलाएँ ।

Step 3- इसके बाद, आपको पर्यावरण चर सेट करने की आवश्यकता है ।

Path User Variable

  • राईट क्लिक करें My Computer
  • चुनते हैं Properties
  • इसके बाद सेलेक्ट करें Advanced टैब पर क्लिक करें Environment Variables
  • एन्वायरमेंट वेरिएबल्स विंडो के तहत , स्क्रीन पर दिखाए गए पैटर्न के अनुसार डबल क्लिक करें ।

  • आपको एक एडिट यूजर वेरिएबल विंडो मिलेगी जैसा कि दिखाया गया है। वैरिएबल मान फ़ील्ड में NodeJs फ़ोल्डर पथ को C: \ Program Files \ nodejs \ node_modules \ npm के रूप में जोड़ें । यदि पथ अन्य फ़ाइलों के लिए पहले से ही सेट है, तो आपको उसके बाद एक अर्धविराम (;) लगाने की आवश्यकता है और नीचे दिखाए अनुसार NodeJs पथ जोड़ें;

आखिर में OK बटन पर क्लिक करें।

System Variable

  • सिस्टम चर के तहत , पथ पर डबल क्लिक करें जैसा कि निम्नलिखित स्क्रीन में दिखाया गया है।

  • आपको दिखाए अनुसार एडिट सिस्टम वैरिएबल विंडो मिलेगी । वैरिएबल मान फ़ील्ड में NodeJs फ़ोल्डर पथ को C: \ Program Files \ n नोड्स के रूप में जोड़ें और नीचे दिखाए गए अनुसार ठीक क्लिक करें -

Step 4 - अपने सिस्टम पर ग्रंट स्थापित करने के लिए आपको वैश्विक स्तर पर ग्रंट की कमांड लाइन इंटरफेस (CLI) स्थापित करने की आवश्यकता है जैसा कि नीचे दिखाया गया है -

npm install -g grunt-cli

उपरोक्त कमांड चलाने से आपके सिस्टम पथ में ग्रंट कमांड को रखा जाएगा , जो इसे किसी भी निर्देशिका से चलाने के लिए बनाता है।

स्थापित कर रहा है घुरघुराना-CLI ग्रंट कार्य धावक स्थापित नहीं है। ग्रंट -क्लि की भूमिका ग्रंट के संस्करण को चलाने के लिए है जिसे ग्रंटफाइल के बगल में स्थापित किया गया है । यह एक मशीन को ग्रंट के कई संस्करणों को एक साथ स्थापित करने की अनुमति देता है।

Step 5 - अब, हम बनाएंगे configuration files ग्रंट को चलाने के लिए।

package.json

Package.json फ़ाइल पास करने के लिए परियोजना के रूट निर्देशिका में रखा गया है, GruntfilePackage.json जब भी आप आदेश चला सही ढंग से प्रत्येक सूचीबद्ध निर्भरता को चलाने के लिए प्रयोग किया जाता हैnpm install package.json के रूप में एक ही फ़ोल्डर में।

T मूल पैकेज.जॉन कमांड प्रॉम्प्ट में निम्नलिखित कमांड टाइप करके बनाया जा सकता है -

npm init

मूल पैकेज.जॉन फ़ाइल को नीचे दिखाया गया है -

{
   "name": "tutorialspoint",
   "version": "0.1.0",
   "devDependencies": {
      "grunt-contrib-jshint": "~0.10.0",
      "grunt-contrib-nodeunit": "~0.4.1",
      "grunt-contrib-uglify": "~0.5.0"
   }
}

आप निम्न आदेश के माध्यम से एक मौजूदा pacakge.json फ़ाइल में ग्रन्ट और ग्रन्टप्लगिन्स जोड़ सकते हैं -

npm install <module> --save-dev

उपरोक्त कमांड में, <मॉड्यूल> स्थानीय रूप से स्थापित किए जाने वाले मॉड्यूल का प्रतिनिधित्व करता है। उपरोक्त कमांड भी स्वचालित रूप से devD dependencies के लिए <मॉड्यूल> जोड़ देगा ।

उदाहरण के लिए, निम्न आदेश का नवीनतम संस्करण नवीनतम स्थापित हो जाएगा ग्रंट और अपने में शामिल करता है devDependencies -

npm install grunt --save-dev

Gruntfile.js

Gruntfile.js फ़ाइल ग्रंट के लिए हमारे विन्यास परिभाषित करने के लिए प्रयोग किया जाता है। यह वह स्थान है जहां हमारी सेटिंग्स लिखी जाएगी। मूल Gruntfile.js फ़ाइल को नीचे दिखाया गया है -

// our wrapper function (required by grunt and its plugins)
// all configuration goes inside this function
module.exports = function(grunt) {
   // CONFIGURE GRUNT
   grunt.initConfig({
      // get the configuration info from package.json file
      // this way we can use things like name and version (pkg.name)
      pkg: grunt.file.readJSON('package.json'),

      // all of our configuration goes here
      uglify: {
         // uglify task configuration
         options: {},
         build: {}
      }
   });

   // log something
   grunt.log.write('Hello world! Welcome to Tutorialspoint!!\n');

   // Load the plugin that provides the "uglify" task.
   grunt.loadNpmTasks('grunt-contrib-uglify');

   // Default task(s).
   grunt.registerTask('default', ['uglify']);
};