Skip to content

Commit

Permalink
feat(sass): Allow modules to specify sass options, such as includePaths
Browse files Browse the repository at this point in the history 
#7
  • Loading branch information
@ariddlestone
ariddlestone committed Apr 7, 2020
1 parent f6e35c1 commit 37460f0
Show file tree
Hide file tree
Showing 6 changed files with 180 additions and 13 deletions.
21 changes: 21 additions & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,27 @@ A gulpfile can now be created using the brokkr command `gulpfile`:
vendor/bin/brokkr gulpfile
```

## Setting SASS options

To set SASS options, include them in the `sass_options` settings for your portal:
```php
<?php
return [
'portals' => [
'main' => [
'css' => [
realpath(__DIR__ . '/../resources/css/**/*.scss'),
],
'sass_options' => [
'includePaths' => [
'vendor/someones/awesome-css-stuff/scss',
],
],
],
],
];
```

## Changing the template

To change the template for your gulpfile, just copy view/gulpfile.js.php somewhere, change it, and add the new path to your module/site's config:
Expand Down
2 changes: 1 addition & 1 deletion src/Command/Gulpfile.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ protected function getPortalConfig()
$portalConfig = [];
foreach($this->getPortalManager()->getPortalNames() as $portalName) {
$portalConfig[$portalName] = [];
foreach(['css', 'js', 'other'] as $type) {
foreach(['css', 'js', 'other', 'sass_options'] as $type) {
$portalConfig[$portalName][$type] = $this->getPortalManager()->getPortalConfig($portalName, $type);
}
}
Expand Down
1 change: 1 addition & 0 deletions test/Command/GulpfileTest.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ public function getTestGulpfileDataProvider()
'test1',
'test2',
'test3',
'test4',
]);
}

Expand Down
111 changes: 111 additions & 0 deletions test/data/test4.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
const {src, dest, parallel, watch} = require("gulp");
const sass = require("gulp-sass");
const minifyCSS = require("gulp-csso");
const concat = require("gulp-concat");
const uglify = require('gulp-uglify');

const main_css_src = [
"foo.scss",
"bar/baz.scss"
];
exports.main_css = function () {
return src(main_css_src, {sourcemaps: true})
.pipe(concat("main.min.css"))
.pipe(sass({
"includePaths": [
"awesome-css-module"
]
}))
.pipe(minifyCSS())
.pipe(dest("public/static/css", {sourcemaps: "."}));
};
exports.main_css_watch = function () {
watch(main_css_src, function (cb) {
exports.main_css();
cb();
});
};

const main_js_src = [
"script.js",
"stuff/**/*.js"
];
exports.main_js = function () {
return src(main_js_src, {sourcemaps: true})
.pipe(concat("main.min.js"))
.pipe(uglify())
.pipe(dest("public/static/js", {sourcemaps: "."}));
};
exports.main_js_watch = function () {
watch(main_js_src, function (cb) {
exports.main_js();
cb();
});
};

const main_other_src = [
"foo.png",
"bar/**/*.jpg"
];
exports.main_other = function () {
return src(main_other_src)
.pipe(dest("public/static"));
};
exports.main_other_watch = function () {
watch(main_other_src, function (cb) {
exports.main_other();
cb();
});
};

exports.main = parallel(exports.main_css, exports.main_js, exports.main_other);
exports.main_watch = parallel(exports.main_css_watch, exports.main_js_watch, exports.main_other_watch);

const admin_css_src = [
"foo.scss",
"bar/admin.scss"
];
exports.admin_css = function () {
return src(admin_css_src, {sourcemaps: true})
.pipe(concat("admin.min.css"))
.pipe(sass())
.pipe(minifyCSS())
.pipe(dest("public/static/css", {sourcemaps: "."}));
};
exports.admin_css_watch = function () {
watch(admin_css_src, function (cb) {
exports.admin_css();
cb();
});
};

const admin_js_src = [
"admin.js"
];
exports.admin_js = function () {
return src(admin_js_src, {sourcemaps: true})
.pipe(concat("admin.min.js"))
.pipe(uglify())
.pipe(dest("public/static/js", {sourcemaps: "."}));
};
exports.admin_js_watch = function () {
watch(admin_js_src, function (cb) {
exports.admin_js();
cb();
});
};

exports.admin = parallel(exports.admin_css, exports.admin_js);
exports.admin_watch = parallel(exports.admin_css_watch, exports.admin_js_watch);

exports.css = parallel(exports.main_css, exports.admin_css);
exports.css_watch = parallel(exports.main_css_watch, exports.admin_css_watch);

exports.js = parallel(exports.main_js, exports.admin_js);
exports.js_watch = parallel(exports.main_js_watch, exports.admin_js_watch);

exports.other = parallel(exports.main_other);
exports.other_watch = parallel(exports.main_other_watch);

exports.default = parallel(exports.css, exports.js, exports.other);
exports.watch = parallel(exports.css_watch, exports.js_watch, exports.other_watch);
30 changes: 30 additions & 0 deletions test/data/test4.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
{
"main": {
"css": [
"foo.scss",
"bar/baz.scss"
],
"js": [
"script.js",
"stuff/**/*.js"
],
"other": [
"foo.png",
"bar/**/*.jpg"
],
"sass_options": {
"includePaths": [
"awesome-css-module"
]
}
},
"admin": {
"css": [
"foo.scss",
"bar/admin.scss"
],
"js": [
"admin.js"
]
}
}
28 changes: 16 additions & 12 deletions view/gulpfile.js.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,18 @@
const concat = require("gulp-concat");
const uglify = require('gulp-uglify');

<?php foreach($portals as $portal => $paths) : ?>
<?php if(!empty($paths['css'])) : ?>
<?php foreach($portals as $portal => $portalConfig) : ?>
<?php if(!empty($portalConfig['css'])) : ?>
<?php $types['css'][] = $portal; ?>
const <?php echo $portal; ?>_css_src = <?php echo json_encode($paths['css'], JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); ?>;
const <?php echo $portal; ?>_css_src = <?php echo json_encode($portalConfig['css'], JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); ?>;
exports.<?php echo $portal; ?>_css = function () {
return src(<?php echo $portal; ?>_css_src, {sourcemaps: true})
.pipe(concat(<?php echo json_encode($portal . '.min.css') ?>))
.pipe(sass())
.pipe(sass(<?php if($portalConfig['sass_options']) echo str_replace(
"\n",
"\n ",
json_encode($portalConfig['sass_options'], JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT)
); ?>))
.pipe(minifyCSS())
.pipe(dest("public/static/css", {sourcemaps: "."}));
};
Expand All @@ -33,9 +37,9 @@
};

<?php endif; ?>
<?php if(!empty($paths['js'])) : ?>
<?php if(!empty($portalConfig['js'])) : ?>
<?php $types['js'][] = $portal; ?>
const <?php echo $portal; ?>_js_src = <?php echo json_encode($paths['js'], JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); ?>;
const <?php echo $portal; ?>_js_src = <?php echo json_encode($portalConfig['js'], JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); ?>;
exports.<?php echo $portal; ?>_js = function () {
return src(<?php echo $portal; ?>_js_src, {sourcemaps: true})
.pipe(concat("<?php echo $portal; ?>.min.js"))
Expand All @@ -50,9 +54,9 @@
};

<?php endif; ?>
<?php if(!empty($paths['other'])) : ?>
<?php if(!empty($portalConfig['other'])) : ?>
<?php $types['other'][] = $portal; ?>
const <?php echo $portal; ?>_other_src = <?php echo json_encode($paths['other'], JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); ?>;
const <?php echo $portal; ?>_other_src = <?php echo json_encode($portalConfig['other'], JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); ?>;
exports.<?php echo $portal; ?>_other = function () {
return src(<?php echo $portal; ?>_other_src)
.pipe(dest("public/static"));
Expand All @@ -67,13 +71,13 @@
<?php endif; ?>
exports.<?php echo $portal; ?> = parallel(<?php echo implode(", ", array_map(function ($type) use ($portal) {
return 'exports.' . $portal . '_' . $type;
}, array_filter(['css', 'js', 'other'], function ($type) use ($paths) {
return !empty($paths[$type]);
}, array_filter(['css', 'js', 'other'], function ($type) use ($portalConfig) {
return !empty($portalConfig[$type]);
}))); ?>);
exports.<?php echo $portal; ?>_watch = parallel(<?php echo implode(", ", array_map(function ($type) use ($portal) {
return 'exports.' . $portal . '_' . $type . '_watch';
}, array_filter(['css', 'js', 'other'], function ($type) use ($paths) {
return !empty($paths[$type]);
}, array_filter(['css', 'js', 'other'], function ($type) use ($portalConfig) {
return !empty($portalConfig[$type]);
}))); ?>);

<?php endforeach; ?>
Expand Down

0 comments on commit 37460f0

Please sign in to comment.