kopia lustrzana https://github.com/shoelace-style/shoelace
63 wiersze
1.9 KiB
JavaScript
63 wiersze
1.9 KiB
JavaScript
//
|
|
// This script bakes and copies themes, then generates a corresponding Lit stylesheet in dist/themes
|
|
//
|
|
import chalk from 'chalk';
|
|
import commandLineArgs from 'command-line-args';
|
|
import fs from 'fs';
|
|
import { mkdirSync } from 'fs';
|
|
import { globbySync } from 'globby';
|
|
import path from 'path';
|
|
import prettier from 'prettier';
|
|
import stripComments from 'strip-css-comments';
|
|
|
|
const { outdir } = commandLineArgs({ name: 'outdir', type: String });
|
|
const files = globbySync('./src/themes/**/[!_]*.css');
|
|
const filesToEmbed = globbySync('./src/themes/**/_*.css');
|
|
const themesDir = path.join(outdir, 'themes');
|
|
const embeds = {};
|
|
|
|
console.log('Generating stylesheets');
|
|
|
|
mkdirSync(themesDir, { recursive: true });
|
|
|
|
try {
|
|
// Gather an object containing the source of all files named "_filename.css" so we can embed them later
|
|
filesToEmbed.forEach(file => {
|
|
embeds[path.basename(file)] = fs.readFileSync(file, 'utf8');
|
|
});
|
|
|
|
// Loop through each theme file, copying the .css and generating a .js version for Lit users
|
|
files.forEach(file => {
|
|
let source = fs.readFileSync(file, 'utf8');
|
|
|
|
// If the source has "/* _filename.css */" in it, replace it with the embedded styles
|
|
Object.keys(embeds).forEach(key => {
|
|
source = source.replace(`/* ${key} */`, embeds[key]);
|
|
});
|
|
|
|
const css = prettier.format(stripComments(source), {
|
|
parser: 'css'
|
|
});
|
|
|
|
let js = prettier.format(
|
|
`
|
|
import { css } from 'lit';
|
|
|
|
export default css\`
|
|
${css}
|
|
\`;
|
|
`,
|
|
{ parser: 'babel-ts' }
|
|
);
|
|
|
|
const cssFile = path.join(themesDir, path.basename(file));
|
|
const jsFile = path.join(themesDir, path.basename(file).replace('.css', '.styles.js'));
|
|
|
|
fs.writeFileSync(cssFile, css, 'utf8');
|
|
fs.writeFileSync(jsFile, js, 'utf8');
|
|
});
|
|
} catch (err) {
|
|
console.error(chalk.red('Error generating stylesheets!'));
|
|
console.error(err);
|
|
}
|