Компилируем LESS при помощи GruntJS
Дата публикации 27/10/14 - 02:30
Шаг 1: Устанавливаем NodeJS
Шаг 2: Устанавливаем GruntJS
npm install -g grunt-cli
Шаг 3: создаем Gruntfile.js
Создаем файл с названием Gruntfile.js в корневой директории вашего проекта со следующим содержимым:
module.exports = function(grunt) {
grunt.initConfig({
less: {
development: {
options: {
compress: true,
yuicompress: true,
optimization: 2
},
files: {
// target.css file: source.less file
"css/main.css": "less/main.less"
}
}
},
watch: {
styles: {
files: ['less/**/*.less'], // which files to watch
tasks: ['less'],
options: {
nospawn: true
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.registerTask('default', ['watch']);
};
grunt.initConfig({
less: {
development: {
options: {
compress: true,
yuicompress: true,
optimization: 2
},
files: {
// target.css file: source.less file
"css/main.css": "less/main.less"
}
}
},
watch: {
styles: {
files: ['less/**/*.less'], // which files to watch
tasks: ['less'],
options: {
nospawn: true
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.registerTask('default', ['watch']);
};
Шаг 4: Создаем файл package.json
Создаем файл также в корневой директории проекта со следующим содержимым:
{
"name": "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",
"grunt-contrib-less": "~0.12.0",
"grunt-contrib-watch": "~0.6.1"
}
}
"name": "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",
"grunt-contrib-less": "~0.12.0",
"grunt-contrib-watch": "~0.6.1"
}
}
Затем устанавливаем все зависимости
npm install
Шаг 5: запускаем Grunt
grunt
Когда Grunt запущен - он будет компилировать все изменения less файла в css.
- 2350 просмотров
Разделы
Комменты
-
Olzhas 2 месяца 3 недели назадСпасибо. С Новым Годом! →
-
Den 3 месяца 2 недели назадВ первой функции, при создании переменной $li_previous нужно поменять '←' с NULL, в $li_next сделать тоже самое. →
-
Гость 3 месяца 2 недели назадЕсли все ровно так как было описано, то нет никаких сомнений что домен увел сам регистратор. Потому что вероятность того →
-
Валерий 4 месяца 2 недели назадда можно делать импорт-экспорт только лишь в оболочке на входя на mysql сервер →
-
admin 4 месяца 2 недели назадВалерий, а зачем вам именно так делать экспорт? Если я не ошибаюсь, то там нет какой-либо команды чтобы сделать экспорт →
-
Валерий 4 месяца 3 недели назадзахожу на mysql через ssh по команде →
-
admin 4 месяца 3 недели назадДобрый вечер, какой у вас клиент? →
-
Валерий 4 месяца 3 недели назадЗдравстуйте, есть команда чтобы сделать экспорт базы внутри mysql клиента? →
-
Eduard 5 месяцев 6 дней назадВидать, домен хороший был. Заявление пробывали писать на мошенника? →
-
Stas 6 месяцев 2 недели назадОшибка в ключе квантификатора - replace(/будешь|пить/ig, "хлеб"); Указать -g для прохода по всем совпадениям! →
Комментарии (0)