Szukaj…


Uwagi

Dalsza lektura:

Podręcznik instalacji gruntu zawiera szczegółowe informacje na temat instalowania konkretnych, produkcyjnych lub w fazie rozwoju, wersji Grunt i grunt-cli.

Podręcznik Konfigurowanie zadań zawiera szczegółowe wyjaśnienie, jak konfigurować zadania, cele, opcje i pliki w Gruntfile, a także objaśnienie szablonów, wzorców globowania i importowania danych zewnętrznych.

Przewodnik tworzenia zadań wymienia różnice między typami zadań Grunt i pokazuje kilka przykładowych zadań i konfiguracji.

Wprowadzenie do GruntJs

Grunt to JavaScript Task Runner, wykorzystywany do automatyzacji powtarzalnych zadań, takich jak minimalizacja, kompilacja, testowanie jednostkowe, linting itp.

Aby rozpocząć, musisz zainstalować globalny interfejs wiersza poleceń (CLI) Grunta.

npm install -g grunt-cli

Przygotowanie nowego projektu Grunt: Typowa konfiguracja wymaga dodania dwóch plików do projektu: package.json i Gruntfile.

package.json: ten plik jest używany przez npm do przechowywania metadanych dla projektów opublikowanych jako moduły npm. W tym pliku wyświetlisz listę chrząstek i wtyczek Grunt, których potrzebuje Twój projekt, jako devDependencies.

Gruntfile: Ten plik ma nazwę Gruntfile.js i służy do konfigurowania lub definiowania zadań i ładowania wtyczek Grunt.

Example package.json:

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

Przykładowy plik mielony:

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {
        src: 'src/<%= pkg.name %>.js',
        dest: 'build/<%= pkg.name %>.min.js'
      }
    }
  });

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

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

};

Instalowanie wtyczek gruntplugins

Dodanie zależności

Aby użyć gruntplugin, musisz najpierw dodać go jako zależność do swojego projektu. Użyjmy wtyczki jshint jako przykładu.

npm install grunt-contrib-jshint --save-dev

Opcja --save-dev służy do dodawania wtyczki do package.json , w ten sposób wtyczka jest zawsze instalowana po npm install .

Ładowanie wtyczki

Możesz załadować wtyczkę do pliku loadNpmTasks za pomocą loadNpmTasks .

grunt.loadNpmTasks('grunt-contrib-jshint');

Konfigurowanie zadania

Konfigurujesz zadanie w pliku gruntu, dodając właściwość o nazwie jshint do obiektu przekazanego do grunt.initConfig .

grunt.initConfig({
  jshint: {
    all: ['Gruntfile.js', 'lib/**/*.js', 'test/**/*.js']
  }
});

Nie zapomnij, że możesz mieć inne właściwości innych używanych wtyczek.

Uruchomienie zadania

Aby po prostu uruchomić zadanie z wtyczką, możesz użyć wiersza polecenia.

grunt jshint

Lub możesz dodać jshint do innego zadania.

grunt.registerTask('default', ['jshint']);

Domyślne zadanie jest uruchamiane z poleceniem chrząknięcia w terminalu bez żadnych opcji.



Modified text is an extract of the original Stack Overflow Documentation
Licencjonowany na podstawie CC BY-SA 3.0
Nie związany z Stack Overflow