يعتمد Grunt على Node.js ويتم تطويره في JS. وبهذه الطريقة ، يمكنك استخدام node.js لتحقيق عمليات سطح المكتب عبر النظام والموضوع عبر الأنظمة ، مثل عمليات الملفات ، وما إلى ذلك ، بالإضافة إلى ذلك ، يتم استخدام جميع الإضافات والمكونات الإضافية كحزمة يمكن إدارتها باستخدام تثبيت NPM.
لذلك ، يمكن لملف مشروع Package.json الذي تم إنشاؤه بواسطة NPM تسجيل المكون الإضافي Grunt المستخدم في المشروع الحالي ، وسيقوم Grunt باستدعاء ملف gruntfile.js ، ويتحلى المهام (المهام) وتنفيذ العمليات المقابلة.
تثبيت Grunt-Cli
في الواقع ، هو تثبيت Grunt-Cli ، حيث يتم تثبيت واجهة سطر أوامر Grunt (CLI). بعد ذلك ، سيتم التعرف على الأمر Grunt في موجه الأوامر. لا يسمى تثبيت Grunt-Cli لتثبيت Grunt. وذلك لأن Grunt نفسه غير مستخدم على مستوى العالم. إذا كنت ترغب في استخدام Grunt ، فأنت بحاجة إلى تثبيت Grunt مرة واحدة لأي دليل عمل محدد. هذا أيضًا لأن الدلائل العاملة المختلفة تتطلب أعمالًا أتمتة مختلفة من خلال Grunt ، لذلك يجب تكوينها بشكل مستقل.
تثبيت NPM -g Grunt -Cli
―save-dev ، مما يشير إلى أنه سيتم إضافة الشيء المثبت حديثًا إلى ملف package.json.
إنشاء ملف package.json
NPM لديه شرط لدليل العمل. هذا المطلب هو: هناك حزمة. json في موقع دليل الجذر.
وثيقة. يحدد هذا الملف بعض معلومات المشروع (الاسم ، الوصف) المقابلة لدليل العمل ، وكذلك تبعيات الحزمة (أي وحدة NPM).
قم بتنفيذ الأمر التالي لتهيئة
NPM init
تثبيت Grunt والمكونات الإضافية المطلوبة لدليل العمل الحالي
الطريقة 1
قمنا بتثبيت Grunt في الدليل العالمي من قبل ، والآن نحتاج إلى تقديمه إلى مسار المشروع الحالي. في الوقت نفسه ، قد تتضمن الإضافات المطلوبة هذه:
دمج الملفات: Grunt-Contrib-Concat
بناء الجملة: Grunt-Contrib-Jshint
SCSS المترجمة: Grunt-Contrib-Sass
ملف مضغوط: Grunt-Contrib-uglify
استمع إلى تغييرات الملف: مشاهدة Grunt-Contrib
إنشاء خادم محلي: توصيل Grunt-Contrib
الطريقة التي يمكن تثبيتها هي:
تثبيت NPM-Save-Dev Gruntnpm تثبيت-المكون الإضافي-المكون الإضافي Save-Dev 1 المكون الإضافي 2
في هذا الوقت ، هناك بعض التعليمات البرمجية الإضافية في مجلد Package.json.
"DevDependencies": {"Grunt": "0.4.1"} ،الطريقة 2 - تغيير الحزمة. json يدويًا
"DevDependencies": {"Grunt": "~ 0.4.1" ، "Grunt-Contrib-Cssmin": "~ 0.7.0"}أضف هذا الحقل يدويًا في ملف package.json وأضف الحزم التي تحتاج إلى الاعتماد عليها. إذا كنت بحاجة فقط إلى تثبيت أحدث إصدار ، فيمكنك تغييره إلى * ثم تنفيذ تثبيت NPM. ستجد أن هناك مجلد Node_Modules في المجلد ، والذي يخزن المكونات الإضافية التي نحتاجها.
إعدادات
بشكل عام ، استخدم القوالب مباشرة كملفات التكوين.
module.exports = function (grunt) {"استخدم صارم" ؛ Grunt.InitConfig ({// plugin configuration area}) ؛ // تحميل مهام البرنامج المساعد ، أضف من تريد استخدام Grunt.LoadNPMTASKS ('' Grunt-Contrib-uglify ') ؛ grunt.loadnpmtasks ('grunt-contrib-cssmin') ؛ grunt.loadnpmtasks ('Grunt-Contrib-Imagemin') ؛ // تسجيل المهمة grunt.registerTask ('الافتراضي' ، ['cssmin' ، 'ImageMin' ، 'Uglify']) ؛} ؛grunt.loadnpmtasks () هي مهمة مكون إضافي تحميل. في الواقع ، إذا كنت ترغب في استخدام وظيفة البرنامج المساعد ، فيرجى استخدام هذا الرمز لإضافة مهمة البرنامج المساعد في هذا الجزء.
Grunt.registerTask () هي مهمة مسجلة ، وهناك افتراضي افتراضيًا. يعني الافتراضي أنه عند استخدامه أخيرًا ، يمكنك إدخال Grunt مباشرة في موجه الأوامر في الدليل لتنفيذ المهمة المسجلة ، والتي تعادل تنفيذ المهمة الافتراضية.
باستخدام المهام المخصصة
يمكن تسجيل المزيد من أوامر المهمة ويمكن استخدام أسماء أخرى. على سبيل المثال
grunt.registerTask ('custom' ، ['cssmin' ، 'ImageMin']) ؛عند استخدامه ، أدخل:
العرف النخر