ربما هناك الخطوات التالية
مشروع جديد bejs
قم بإنشاء حزمة ملفات جديدة
إنشاء ملف جديد gruntfile.js
تنفيذ المهام الشخرية على سطر الأوامر
1. مشروع جديد bejs
يتم وضع الرمز المصدري ضمن SRC ، ويحتوي الدليل على ملفان JS ، Selector.js و Ajax.js. بعد التجميع ، يتم وضع الرمز في Dest ، وسيتم إنشاء هذا النخاع تلقائيًا.
2. قم بإنشاء حزمة جديدة
يتم وضع package.json في دليل الجذر ويحتوي على بعض معلومات التعريف للمشروع ، مثل اسم المشروع ، الوصف ، رقم الإصدار ، حزمة التبعية ، إلخ. يجب إرساله إلى SVN أو GIT مثل الرمز المصدري. هيكل المشروع الحالي كما يلي
يجب أن يتوافق محتوى package.json مع مواصفات بناء جملة JSON ، على النحو التالي
نسخة الكود كما يلي:
{
"الاسم": "bejs" ،
"الإصدار": "0.1.0" ،
"DevDependencies": {
"Grunt": "~ 0.4.0" ،
"Grunt-Contrib-Jshint": "~ 0.1.1" ،
"Grunt-Contrib-uglify": "~ 0.1.2" ،
"Grunt-Contrib-Concat": "~ 0.1.1"
}
}
تم تثبيت Grunt in DevDependers في المقالة السابقة ، في حين لم يتم تثبيت Grunt-Contrib-Jshint/Grunt-Contrib-uclify/Grunt-Contrib-Concat. ثلاث لثلاث مهام
Grunt-Contrib-JS Syntax Check
ضغط غونترب-إغلاس ، باستخدام UglifyJS
Grunt-Contrib-Concat دمج ملفات
في هذا الوقت ، افتح أداة سطر الأوامر وأدخل دليل جذر المشروع ، واكتب الأمر التالي: تثبيت NPM
تحقق من دليل الجذر مرة أخرى ووجد أن هناك دليلًا إضافيًا node_modules ، بما في ذلك أربعة دلالات فرعية ، انظر الصورة
3. إنشاء ملف جديد gruntfile.js
يتم وضع gruntfile.js أيضًا في دليل جذر المشروع. يتم تعريف جميع المهام تقريبًا في هذا الملف. إنه ملف JS عادي ، حيث يمكن كتابة أي رمز JS بدلاً من JSON. مثل package.json ، يجب إرساله إلى SVN أو git مثل رمز المصدر.
يتكون gruntfile.js من المحتوى التالي
وظيفة الغلاف لها الهيكل التالي. هذه طريقة نموذجية لكتابة node.js. استخدم الصادرات لفضح واجهة برمجة التطبيقات
نسخة الكود كما يلي:
module.exports = function (grunt) {
// افعل الأشياء المتعلقة
} ؛
تكوين المشروع والمهمة
قم بتحميل الإضافات والمهام Grunt
تخصيص تنفيذ المهام
هذا المثال يكمل المهام التالية
دمج الملفات تحت SRC (ajax.js/selector.js) إلى domop.js
ضغط domop.js إلى domop.min.js
يتم وضع كلا الملفين في دليل القدر
Gruntfile.js النهائي كما يلي
نسخة الكود كما يلي:
module.exports = function (grunt) {
// إعدادات
grunt.initConfig ({
PKG: grunt.file.readjson ('package.json') ،
CONCAT: {
ندوب: {
SRC: ['src/ajax.js' ، 'src/selector.js'] ،
القدر: 'dest/domop.js'
}
} ،
Uglify: {
خيارات: {
لافتة: '/*! <٪ = pkg.name ٪> <٪ = grunt.template.today ("yyyy-mm-dd") ٪> *// n '
} ،
يبني : {
SRC: 'Dest/domop.js' ،
القدر: 'dest/domop.min.js'
}
}
}) ؛
// load concat و uglify الإضافات ، لدمج وضغط على التوالي
grunt.loadnpmtasks ('Grunt-Contrib-Concat') ؛
grunt.loadnpmtasks ('' Grunt-contrib-uglify ') ؛
// تسجيل مهمة
grunt.registerTask ('الافتراضي' ، ['concat' ، 'uglify']) ؛
} ؛
4. تنفيذ مهام النخر
افتح سطر الأوامر ، وأدخل دليل جذر المشروع ، وانقر فوق Grunt
من معلومات الطباعة ، يُرى أنه يتم إنشاء الاندماج والضغط الناجحين وأن يتم إنشاء دليل القدر والملفات المتوقعة. في هذا الوقت ، هناك المزيد من القدر في دليل المشروع ، على النحو التالي
حسنًا ، فيما يلي مهامتان شائعتان ، Concat و Uglify ، JShint ، وما إلى ذلك ، والتي لم يتم تقديمها. لا يتم تفسير الكود في gruntfile.js واحدا تلو الآخر. يمكن للطلاب المهتمين العثور عليه في الوثيقة الرسمية لـ Gruntjs.