Commit 4a3d830e authored by Nikolay Gromov's avatar Nikolay Gromov

Добавил возможность компилировать SCSS файлы отдельно

parent bba35634
...@@ -82,6 +82,8 @@ demo-block/ # Папка блока ...@@ -82,6 +82,8 @@ demo-block/ # Папка блока
`addCssAfter` — массив с дополнительными стилевыми файлами, которые будут взяты в компиляцию ПОСЛЕ стилевых файлов блоков. `addCssAfter` — массив с дополнительными стилевыми файлами, которые будут взяты в компиляцию ПОСЛЕ стилевых файлов блоков.
`singleCompiled` — массив стилевых файлов, которые будут скомпилированы по отдельности.
`addJsBefore` — массив js-файлов, которые будут взяты в обработку (конкатенация/сжатие) ПЕРЕД js-файлами блоков. `addJsBefore` — массив js-файлов, которые будут взяты в обработку (конкатенация/сжатие) ПЕРЕД js-файлами блоков.
`addJsAfter` — массив js-файлов, которые будут взяты в обработку (конкатенация/сжатие) ПОСЛЕ js-файлаов блоков. `addJsAfter` — массив js-файлов, которые будут взяты в обработку (конкатенация/сжатие) ПОСЛЕ js-файлаов блоков.
......
...@@ -24,7 +24,7 @@ const newer = require('gulp-newer'); ...@@ -24,7 +24,7 @@ const newer = require('gulp-newer');
let pjson = require('./package.json'); let pjson = require('./package.json');
let dirs = pjson.configProject.dirs; let dirs = pjson.configProject.dirs;
let lists = getFilesList(pjson.configProject); let lists = getFilesList(pjson.configProject);
console.log(lists); // console.log(lists);
// Запишем стилевой файл диспетчер подключений // Запишем стилевой файл диспетчер подключений
let styleImports = '/**\n * ВНИМАНИЕ! Этот файл генерируется автоматически.\n * Не пишите сюда ничего вручную, все такие правки будут потеряны.\n * Читайте ./README.md для понимания.\n */\n\n'; let styleImports = '/**\n * ВНИМАНИЕ! Этот файл генерируется автоматически.\n * Не пишите сюда ничего вручную, все такие правки будут потеряны.\n * Читайте ./README.md для понимания.\n */\n\n';
...@@ -54,7 +54,7 @@ gulp.task('clean', function () { ...@@ -54,7 +54,7 @@ gulp.task('clean', function () {
]); ]);
}); });
// Компиляция стилей // Компиляция стилей блоков проекта (и добавочных)
gulp.task('style', function () { gulp.task('style', function () {
const sass = require('gulp-sass'); const sass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps'); const sourcemaps = require('gulp-sourcemaps');
...@@ -85,6 +85,38 @@ gulp.task('style', function () { ...@@ -85,6 +85,38 @@ gulp.task('style', function () {
.pipe(browserSync.stream({match: '**/*.css'})); .pipe(browserSync.stream({match: '**/*.css'}));
}); });
// Компиляция отдельных файлов
gulp.task('style:single', function () {
if(pjson.configProject.singleCompiled.length) {
const sass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps');
console.log('---------- Компиляция добавочных стилей');
return gulp.src(pjson.configProject.singleCompiled)
.pipe(plumber({
errorHandler: function(err) {
notify.onError({
title: 'Styles compilation error',
message: err.message
})(err);
this.emit('end');
}
}))
.pipe(gulpIf(isDev, sourcemaps.init()))
.pipe(debug({title: "Single style:"}))
.pipe(sass())
.pipe(postcss(postCssPlugins))
.pipe(gulpIf(!isDev, cleanss()))
.pipe(gulpIf(isDev, sourcemaps.write('/')))
.pipe(size({
title: 'Размер',
showFiles: true,
showTotal: false,
}))
.pipe(gulp.dest(dirs.buildPath + '/css'))
.pipe(browserSync.stream({match: '**/*.css'}));
}
});
// Копирование добавочных CSS, которые хочется иметь отдельными файлами // Копирование добавочных CSS, которые хочется иметь отдельными файлами
gulp.task('copy:css', function(callback) { gulp.task('copy:css', function(callback) {
if(pjson.configProject.copiedCss.length) { if(pjson.configProject.copiedCss.length) {
...@@ -301,7 +333,7 @@ gulp.task('build', function (callback) { ...@@ -301,7 +333,7 @@ gulp.task('build', function (callback) {
gulpSequence( gulpSequence(
'clean', 'clean',
['sprite:svg', 'sprite:png'], ['sprite:svg', 'sprite:png'],
['style', 'js', 'copy:css', 'copy:img', 'copy:js', 'copy:fonts'], ['style', 'style:single', 'js', 'copy:css', 'copy:img', 'copy:js', 'copy:fonts'],
'html', 'html',
callback callback
); );
...@@ -330,6 +362,8 @@ gulp.task('serve', ['build'], function() { ...@@ -330,6 +362,8 @@ gulp.task('serve', ['build'], function() {
dirs.srcPath + dirs.blocksDirName + '/**/*.scss', dirs.srcPath + dirs.blocksDirName + '/**/*.scss',
dirs.srcPath + '/scss/**/*.scss', dirs.srcPath + '/scss/**/*.scss',
], ['style']); ], ['style']);
// Слежение за отдельными стилями
gulp.watch(pjson.configProject.singleCompiled, ['style:single',]);
// Слежение за добавочными стилями // Слежение за добавочными стилями
if(pjson.configProject.copiedCss.length) { if(pjson.configProject.copiedCss.length) {
gulp.watch(pjson.configProject.copiedCss, ['copy:css']); gulp.watch(pjson.configProject.copiedCss, ['copy:css']);
......
...@@ -24,6 +24,7 @@ ...@@ -24,6 +24,7 @@
"addCssAfter": [ "addCssAfter": [
"./src/scss/print.scss" "./src/scss/print.scss"
], ],
"singleCompiled": [],
"addJsBefore": [ "addJsBefore": [
"./node_modules/jquery/dist/jquery.min.js", "./node_modules/jquery/dist/jquery.min.js",
"./node_modules/jquery-migrate/dist/jquery-migrate.min.js", "./node_modules/jquery-migrate/dist/jquery-migrate.min.js",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment