প্রথম Grunt প্রজেক্ট তৈরি করা

Grunt সেটআপ এবং ইনস্টলেশন - গ্রান্ট (Grunt) - Web Development

224

Grunt ব্যবহার শুরু করার জন্য প্রথমে আপনাকে একটি প্রজেক্ট তৈরি করতে হবে, তারপর সেই প্রজেক্টে গ্রান্ট কনফিগারেশন ফাইল এবং প্রয়োজনীয় প্লাগইন যুক্ত করতে হবে। এখানে আমরা দেখব কিভাবে আপনি সহজেই একটি নতুন Grunt প্রজেক্ট তৈরি করতে পারেন।

প্রথম Grunt প্রজেক্ট তৈরি করার জন্য প্রয়োজনীয় পদক্ষেপ

১. Node.js এবং npm ইনস্টল করা

Grunt এর সাথে কাজ করতে হলে প্রথমে Node.js এবং npm (Node Package Manager) আপনার সিস্টেমে ইনস্টল থাকতে হবে। আপনি নিচের লিঙ্ক থেকে Node.js ডাউনলোড এবং ইনস্টল করতে পারেন:

Node.js ডাউনলোড পেজ

ইনস্টলেশন শেষে, npm (যা Node.js এর সাথে ইনস্টল হয়) ব্যবহার করে Grunt ইনস্টল করা যাবে।

২. নতুন প্রজেক্ট তৈরি করা

একটি নতুন ফোল্ডার তৈরি করুন এবং সেখানে একটি নতুন npm প্রোজেক্ট তৈরি করুন। এটি করার জন্য নিচের কমান্ডটি চালান:

mkdir my-first-grunt-project
cd my-first-grunt-project
npm init -y

এটি একটি নতুন package.json ফাইল তৈরি করবে, যেখানে আপনার প্রজেক্টের সমস্ত ডিপেনডেন্সি রেকর্ড হবে।

৩. Grunt CLI ইনস্টল করা

Grunt CLI (Command Line Interface) আপনার সিস্টেমে ইনস্টল করতে হবে, যাতে আপনি গ্রান্ট কমান্ড ব্যবহার করতে পারেন:

npm install -g grunt-cli

এটি Grunt CLI কে আপনার সিস্টেমে গ্লোবালি ইনস্টল করবে, যার মাধ্যমে আপনি গ্রান্ট কমান্ড ব্যবহার করতে পারবেন।

৪. Grunt ইনস্টল করা

এখন আপনার প্রজেক্ট ফোল্ডারে গ্রান্ট ইনস্টল করতে হবে। এটি করার জন্য নিচের কমান্ডটি চালান:

npm install grunt --save-dev

এটি grunt কে আপনার প্রজেক্টের ডেভেলপমেন্ট ডিপেনডেন্সি হিসেবে ইনস্টল করবে।

৫. Grunt কনফিগারেশন ফাইল তৈরি করা

এখন আপনি একটি কনফিগারেশন ফাইল তৈরি করবেন। Grunt এর কনফিগারেশন ফাইলটি Gruntfile.js নামে পরিচিত। এই ফাইলটি Grunt কে কোন টাস্কগুলো চালাতে হবে তা নির্দেশ করে।

নতুন Gruntfile.js তৈরি করুন এবং নিচের কোডটি লিখুন:

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    // Grunt এর টাস্ক কনফিগারেশন
    uglify: {
      my_target: {
        files: {
          'dist/output.min.js': ['src/input.js']
        }
      }
    }
  });

  // প্লাগইন লোড করা
  grunt.loadNpmTasks('grunt-contrib-uglify');

  // ডিফল্ট টাস্ক
  grunt.registerTask('default', ['uglify']);
};

এখানে আমরা grunt-contrib-uglify প্লাগইন ব্যবহার করেছি, যা JavaScript ফাইল মিনিফাই (minify) করতে ব্যবহৃত হয়। grunt.initConfig এর মধ্যে আপনি গ্রান্ট টাস্কের কনফিগারেশন লিখবেন।

৬. প্লাগইন ইনস্টল করা

যেহেতু আমরা grunt-contrib-uglify প্লাগইন ব্যবহার করেছি, এটি ইনস্টল করতে হবে:

npm install grunt-contrib-uglify --save-dev

৭. Grunt টাস্ক চালানো

এখন আপনি Grunt টাস্ক চালানোর জন্য প্রস্তুত। কমান্ড লাইন থেকে নিচের কমান্ডটি চালান:

grunt

এটি আপনার src/input.js ফাইলটি মিনিফাই করে dist/output.min.js ফাইলে রূপান্তর করবে।


এভাবে আপনি প্রথম Grunt প্রজেক্ট তৈরি করতে পারেন। এই প্রজেক্টের মাধ্যমে আপনি শিখতে পারেন কিভাবে Grunt টাস্ক তৈরি, কনফিগার এবং চালানো যায়। আরও জটিল এবং বিভিন্ন টাস্ক যোগ করে প্রজেক্টটি আরও উন্নত করা সম্ভব।

Content added By
Promotion

Are you sure to start over?

Loading...