3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-05-30 22:36:11 +02:00
Code Issues Projects Releases Packages Wiki Activity

✨ Adds CSS modules to the build pipeline

Browse source
This commit is contained in:
alonso.torres 2023-03-06 14:13:21 +01:00
parent 0e585cd585
commit 94a98a1866
6 changed files with 134 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

29
frontend/gulpfile.js
View file

@ -12,6 +12,8 @@ const gulpSass = require("gulp-sass")(require("sass"));
const svgSprite = require("gulp-svg-sprite");
const autoprefixer = require("autoprefixer")
const modules = require("postcss-modules");
const clean = require("postcss-clean");
const mkdirp = require("mkdirp");
const rimraf = require("rimraf");
@ -159,7 +161,7 @@ function templatePipeline(options) {
const tmpl = gulpMustache({
ts: ts,
th: th,
// th: th,
manifest: manifest,
translations: JSON.stringify(locales),
themes: JSON.stringify(themes),
@ -179,16 +181,36 @@ function templatePipeline(options) {
gulpSass.compiler = sass;
gulp.task("scss", function() {
gulp.task("scss:modules", function() {
return gulp.src(["src/**/**.scss"])
.pipe(gulpSass.sync().on('error', gulpSass.logError))
.pipe(gulpPostcss([
modules({
generateScopedName: "[folder]_[name]_[local]_[hash:base64:5]",
}),
autoprefixer(),
]))
.pipe(gulp.dest(paths.output + "css/"));
});
gulp.task("scss:main", function() {
return gulp.src(paths.resources + "styles/main-default.scss")
.pipe(gulpSass.sync().on('error', gulpSass.logError))
.pipe(gulpPostcss([
autoprefixer,
// clean({format: "keep-breaks", level: 1})
]))
.pipe(gulp.dest(paths.output + "css/"));
});
gulp.task("scss:concat", function() {
return gulp.src([paths.output + "css/main-default.css",
paths.output + "css/app/**/*.css"])
.pipe(gulpConcat("main.css"))
.pipe(gulp.dest(paths.output + "css/"));
});
gulp.task("scss", gulp.series("scss:main", "scss:modules", "scss:concat"));
gulp.task("svg:sprite:icons", function() {
return gulp.src(paths.resources + "images/icons/*.svg")
.pipe(gulpRename({prefix: "icon-"}))
@ -250,6 +272,7 @@ gulp.task("dev:dirs", async function(next) {
});
gulp.task("watch:main", function() {
gulp.watch("src/**/**.scss", gulp.series("scss"));
gulp.watch(paths.resources + "styles/**/**.scss", gulp.series("scss"));
gulp.watch(paths.resources + "images/**/*", gulp.series("copy:assets:images"));