Grunt didasarkan pada node.js dan dikembangkan di JS. Dengan cara ini, Anda dapat menggunakan Node.js untuk mewujudkan operasi desktop lintas-sistem dan lintas platform, seperti operasi file, dll. Selain itu, Grunt dan plug-in-nya semuanya digunakan sebagai paket yang dapat dikelola menggunakan instalasi NPM.
Oleh karena itu, file proyek package.json yang dihasilkan oleh NPM dapat merekam plug-in Grunt yang digunakan dalam proyek saat ini, dan Grunt akan menghubungi file Gruntfile.js, menguraikan tugas (tugas) dan melakukan operasi yang sesuai.
Instal Grunt-Cli
Bahkan, itu untuk menginstal Grunt-Cli, di mana antarmuka baris perintah Grunt (CLI) diinstal. Setelah itu, perintah Grunt akan dikenali dalam prompt perintah. Menginstal Grunt-Cli tidak disebut menginstal Grunt. Ini karena Grunt sendiri tidak digunakan secara global. Jika Anda ingin menggunakan Grunt, Anda perlu menginstal Grunt sekali untuk direktori kerja tertentu. Ini juga karena direktori kerja yang berbeda memerlukan pekerjaan otomatisasi yang berbeda melalui Grunt, sehingga perlu dikonfigurasi secara mandiri.
NPM Instal -G Grunt -Cli
―Save-dev parameter, menunjukkan bahwa hal yang baru diinstal akan ditambahkan ke file package.json.
Hasilkan file package.json
NPM memiliki persyaratan untuk direktori kerja. Persyaratan ini adalah: ada paket.json di lokasi direktori root.
dokumen. File ini mendefinisikan beberapa informasi proyek (nama, deskripsi) yang sesuai dengan direktori kerja, serta dependensi paket (yaitu, modul NPM).
Jalankan perintah berikut untuk menginisialisasi
Init NPM
Instal Grunt dan Plugin yang Diperlukan untuk Direktori Kerja Saat Ini
Metode 1
Kami menginstal Grunt di Direktori Global sebelumnya, dan sekarang kami perlu memperkenalkannya ke jalur proyek saat ini. Pada saat yang sama, plugin yang diperlukan mungkin termasuk ini:
Gabungan file: Grunt-Contrib-Concat
Sintaks Pemeriksaan: Grunt-Contrib-Jshint
SCSS Compiled: Grunt-Contrib-Sass
File Terkompresi: Grunt-Contrib-Uglify
Dengarkan Perubahan File: Watch-Contrib-Watch
Buat server lokal: koneksi kasar
Cara mereka dapat diinstal adalah:
Instal NPM-Save-Dev Gruntnpm Instal-Plugin Plugin 1 Plugin 2 Plugin 3
Pada saat ini, ada beberapa kode tambahan di folder package.json.
"DevDependencies": {"Grunt": "0.4.1"},Metode 2 - Ubah paket.json secara manual
"DevDependencies": {"Grunt": "~ 0.4.1", "Grunt-Contrib-Cssmin": "~ 0.7.0"}Tambahkan bidang ini secara manual di file package.json dan tambahkan paket yang perlu diandalkan. Jika Anda hanya perlu menginstal versi terbaru, Anda dapat mengubahnya menjadi * dan kemudian menjalankan instalasi NPM. Anda akan menemukan bahwa ada folder node_modules di folder, yang menyimpan plug-in yang kita butuhkan.
Konfigurasi
Secara umum, gunakan template secara langsung sebagai file konfigurasi.
module.exports = function (grunt) {"Gunakan ketat"; grunt.initconfig ({// area konfigurasi plugin}); // Muat tugas plugin, tambahkan siapa pun yang ingin Anda gunakan grunt.loadnpmtasks ('Grunt-Contrib-Uglify'); Grunt.LoadnpmTasks ('Grunt-Contrib-Cssmin'); Grunt.LoadnpmTasks ('Grunt-Contrib-Imagemin'); // Daftarkan tugas grunt.registerTask ('default', ['cssmin', 'Imagemin', 'Uglify']);};Grunt.LoadNPMTasks () adalah tugas plugin pemuatan. Bahkan, jika Anda ingin menggunakan fungsi plugin mana, silakan gunakan kode ini untuk menambahkan tugas plugin di bagian ini.
Grunt.RegisterTask () adalah tugas terdaftar, dan ada default secara default. Default berarti bahwa ketika Anda menggunakannya terakhir, Anda dapat langsung memasukkan Grunt di prompt perintah di direktori untuk menjalankan tugas terdaftar, yang setara dengan melaksanakan tugas default.
Menggunakan tugas khusus
Lebih banyak perintah tugas dapat terdaftar dan nama lain dapat digunakan. Misalnya
Grunt.RegisterTask ('custom', ['cssmin', 'Imagemin']);Saat menggunakannya, masukkan:
Custom Grunt