mirror of
https://github.com/pheralb/svgl.git
synced 2025-12-29 08:01:36 +08:00
🛠️ Refactor SVG optimization and parsing in generate-registry script, use custom utilities
This commit is contained in:
+10
-41
@@ -6,14 +6,14 @@ import { exec } from "child_process";
|
|||||||
import { promisify } from "util";
|
import { promisify } from "util";
|
||||||
|
|
||||||
import { svgs } from "./src/data/svgs";
|
import { svgs } from "./src/data/svgs";
|
||||||
import { optimize } from "svgo";
|
import { optimizeSvg } from "./src/utils/optimizeSvg";
|
||||||
import { parse, print } from "@swc/core";
|
import { parseReactSvgContent } from "./src/utils/parseReactSvgContent";
|
||||||
|
|
||||||
const execAsync = promisify(exec);
|
const execAsync = promisify(exec);
|
||||||
|
|
||||||
// ⚙️ Settings:
|
// ⚙️ Settings:
|
||||||
const MINIFY_TSX = false;
|
const MINIFY_TSX = false;
|
||||||
const REGENERATE_ALL = false;
|
const REGENERATE_ALL = true;
|
||||||
const SVGS_DATA = svgs;
|
const SVGS_DATA = svgs;
|
||||||
const PUBLIC_FOLDER = "static";
|
const PUBLIC_FOLDER = "static";
|
||||||
const SHADCN_COMMAND = "shadcn build --output ./static/r";
|
const SHADCN_COMMAND = "shadcn build --output ./static/r";
|
||||||
@@ -208,45 +208,14 @@ function createSpinner() {
|
|||||||
|
|
||||||
async function convertSvgToReact(svgPath: string): Promise<string> {
|
async function convertSvgToReact(svgPath: string): Promise<string> {
|
||||||
const rawSvg = await fs.promises.readFile(svgPath, "utf-8");
|
const rawSvg = await fs.promises.readFile(svgPath, "utf-8");
|
||||||
|
const optimizedSvg = optimizeSvg({ svgCode: rawSvg });
|
||||||
const { data: optimizedSvg } = optimize(rawSvg, {
|
|
||||||
multipass: true,
|
|
||||||
plugins: [
|
|
||||||
"removeDimensions",
|
|
||||||
"removeXMLNS",
|
|
||||||
"removeDoctype",
|
|
||||||
"removeComments",
|
|
||||||
"removeStyleElement",
|
|
||||||
"cleanupAttrs",
|
|
||||||
"cleanupEnableBackground",
|
|
||||||
"cleanupIds",
|
|
||||||
"minifyStyles",
|
|
||||||
"removeDoctype",
|
|
||||||
"removeDesc",
|
|
||||||
"removeEmptyAttrs",
|
|
||||||
"removeEmptyText",
|
|
||||||
"removeHiddenElems",
|
|
||||||
"removeNonInheritableGroupAttrs",
|
|
||||||
"removeUnknownsAndDefaults",
|
|
||||||
"removeUselessDefs",
|
|
||||||
"removeUselessStrokeAndFill",
|
|
||||||
"removeXMLProcInst",
|
|
||||||
{
|
|
||||||
name: "removeAttrs",
|
|
||||||
params: { attrs: "(data-name|id|class)" },
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
const componentName = toComponentName(path.basename(svgPath, ".svg"));
|
const componentName = toComponentName(path.basename(svgPath, ".svg"));
|
||||||
const componentCode = `
|
const code = await parseReactSvgContent({
|
||||||
import type { SVGProps } from "react";
|
componentName,
|
||||||
const ${componentName} = (props: SVGProps<SVGSVGElement>) => {
|
svgCode: optimizedSvg,
|
||||||
return ${optimizedSvg.replace("<svg", "<svg {...props}")}
|
typescript: true,
|
||||||
}
|
minify: MINIFY_TSX,
|
||||||
export { ${componentName} }
|
});
|
||||||
`;
|
|
||||||
const ast = await parse(componentCode, { syntax: "typescript", tsx: true });
|
|
||||||
const { code } = await print(ast, { minify: MINIFY_TSX });
|
|
||||||
return code;
|
return code;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user