mirror of
https://github.com/penpot/penpot.git
synced 2025-03-13 00:01:51 -05:00
Merge pull request #4856 from penpot/ladybenko-8337-enable-ds-css-override
Enable design system CSS override + fix debug css compiling
This commit is contained in:
commit
2bb59671dd
2 changed files with 30 additions and 23 deletions
|
@ -27,6 +27,8 @@ export function startWorker() {
|
|||
});
|
||||
}
|
||||
|
||||
export const isDebug = process.env.NODE_ENV !== "production";
|
||||
|
||||
async function findFiles(basePath, predicate, options = {}) {
|
||||
predicate =
|
||||
predicate ??
|
||||
|
@ -75,20 +77,33 @@ export async function compileSass(worker, path, options) {
|
|||
return worker.exec("compileSass", [path, options]);
|
||||
}
|
||||
|
||||
export async function compileSassDebug(worker) {
|
||||
const result = await compileSass(worker, "resources/styles/debug.scss", {});
|
||||
return `${result.css}\n`;
|
||||
}
|
||||
|
||||
export async function compileSassAll(worker) {
|
||||
const limitFn = pLimit(4);
|
||||
const sourceDir = "src";
|
||||
|
||||
let files = await fs.readdir(sourceDir, { recursive: true });
|
||||
files = files.filter((path) => path.endsWith(".scss"));
|
||||
files = files.map((path) => ph.join(sourceDir, path));
|
||||
const isDesignSystemFile = (path) => {
|
||||
return path.startsWith("app/main/ui/ds/");
|
||||
};
|
||||
|
||||
const procs = [
|
||||
compileSass(worker, "resources/styles/main-default.scss", {}),
|
||||
compileSass(worker, "resources/styles/debug.scss", {}),
|
||||
];
|
||||
let files = (await fs.readdir(sourceDir, { recursive: true })).filter(
|
||||
isSassFile,
|
||||
);
|
||||
|
||||
for (let path of files) {
|
||||
const appFiles = files
|
||||
.filter((path) => !isDesignSystemFile(path))
|
||||
.map((path) => ph.join(sourceDir, path));
|
||||
const dsFiles = files
|
||||
.filter(isDesignSystemFile)
|
||||
.map((path) => ph.join(sourceDir, path));
|
||||
|
||||
const procs = [compileSass(worker, "resources/styles/main-default.scss", {})];
|
||||
|
||||
for (let path of [...dsFiles, ...appFiles]) {
|
||||
const proc = limitFn(() => compileSass(worker, path, { modules: true }));
|
||||
procs.push(proc);
|
||||
}
|
||||
|
@ -96,7 +111,7 @@ export async function compileSassAll(worker) {
|
|||
const result = await Promise.all(procs);
|
||||
|
||||
return result.reduce(
|
||||
(acc, item, index) => {
|
||||
(acc, item) => {
|
||||
acc.index[item.outputPath] = item.css;
|
||||
acc.items.push(item.outputPath);
|
||||
return acc;
|
||||
|
@ -105,16 +120,6 @@ export async function compileSassAll(worker) {
|
|||
);
|
||||
}
|
||||
|
||||
function compare(a, b) {
|
||||
if (a < b) {
|
||||
return -1;
|
||||
} else if (a > b) {
|
||||
return 1;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
|
||||
export function concatSass(data) {
|
||||
const output = [];
|
||||
|
||||
|
@ -175,7 +180,7 @@ async function renderTemplate(path, context = {}, partials = {}) {
|
|||
|
||||
context = Object.assign({}, context, {
|
||||
ts: ts,
|
||||
isDebug: process.env.NODE_ENV !== "production",
|
||||
isDebug,
|
||||
});
|
||||
|
||||
return mustache.render(content, context, partials);
|
||||
|
@ -400,6 +405,11 @@ export async function compileStyles() {
|
|||
await fs.mkdir("./resources/public/css", { recursive: true });
|
||||
await fs.writeFile("./resources/public/css/main.css", result);
|
||||
|
||||
if (isDebug) {
|
||||
let debugCSS = await compileSassDebug(worker);
|
||||
await fs.writeFile("./resources/public/css/debug.css", debugCSS);
|
||||
}
|
||||
|
||||
const end = process.hrtime(start);
|
||||
log.info("done: compile styles", `(${ppt(end)})`);
|
||||
worker.terminate();
|
||||
|
|
|
@ -1,6 +1,3 @@
|
|||
import fs from "node:fs/promises";
|
||||
import ppt from "pretty-time";
|
||||
import log from "fancy-log";
|
||||
import * as h from "./_helpers.js";
|
||||
|
||||
await h.compileStyles();
|
||||
|
|
Loading…
Add table
Reference in a new issue