fix build issues by removing style elements with svgo

Author: maltejur

index.ts

@@ -4,6 +4,7 @@ import fsAsync from "fs/promises";
 import { JSDOM } from "jsdom";
 import { exec } from "child_process";
 import svgtojsx from "svg-to-jsx";
+import svgo from "svgo";
 
 interface ConfigEntry {
   name: string;
@@ -28,9 +29,7 @@ interface ConfigEntry {
     fs.rmSync(`${__dirname}/dist`, { recursive: true });
   fsAsync.mkdir(`${__dirname}/tmp`);
 
-  await degit("https://github.com/devicons/devicon.git").clone(
-    `${__dirname}/tmp/devicon`
-  );
+  await degit("devicons/devicon").clone(`${__dirname}/tmp/devicon`);
 
   const deviconConfig: ConfigEntry[] = JSON.parse(
     (await fsAsync.readFile(`${__dirname}/tmp/devicon/devicon.json`)).toString()
@@ -55,7 +54,10 @@ interface ConfigEntry {
           const icon = await fsAsync.readFile(
             `${__dirname}/tmp/devicon/icons/${entry.name}/${name}.svg`
           );
-          const { document } = new JSDOM(icon).window;
+          const optimizedIcon = svgo.optimize(icon, {
+            plugins: ["removeStyleElement"],
+          }) as svgo.OptimizedSvg;
+          const { document } = new JSDOM(optimizedIcon.data).window;
           const dir = `${__dirname}/tmp/dist/${entry.name}/${version}`;
           const reactName =
             name

package.json

@@ -7,26 +7,28 @@
     "release": "ts-node publish.ts"
   },
   "devDependencies": {
-    "@babel/cli": "^7.17.6",
-    "@babel/core": "^7.17.8",
-    "@babel/plugin-syntax-jsx": "^7.16.7",
-    "@babel/plugin-transform-parameters": "^7.16.7",
-    "@babel/preset-react": "^7.16.7",
-    "@octokit/core": "^3.6.0",
+    "@babel/cli": "^7.18.9",
+    "@babel/core": "^7.18.9",
+    "@babel/plugin-syntax-jsx": "^7.18.6",
+    "@babel/plugin-transform-parameters": "^7.18.8",
+    "@babel/preset-react": "^7.18.6",
+    "@octokit/core": "^4.0.4",
     "@types/degit": "^2.8.3",
-    "@types/jsdom": "^16.2.14",
-    "@types/node": "^17.0.23",
-    "@types/react": "^17.0.42",
-    "axios": "^0.26.1",
-    "babel-preset-minify": "^0.5.1",
+    "@types/jsdom": "^16.2.15",
+    "@types/node": "^18.0.6",
+    "@types/react": "^18.0.15",
+    "@types/svgo": "^2.6.3",
+    "axios": "^0.27.2",
+    "babel-preset-minify": "^0.5.2",
     "degit": "^2.8.4",
-    "dotenv": "^16.0.0",
-    "jsdom": "^19.0.0",
+    "dotenv": "^16.0.1",
+    "jsdom": "^20.0.0",
     "svg-to-jsx": "^1.0.4",
-    "ts-node": "^10.7.0",
-    "typescript": "^4.6.2"
+    "svgo": "^2.8.0",
+    "ts-node": "^10.9.1",
+    "typescript": "^4.7.4"
   },
   "dependencies": {
-    "react": "^17.0.2"
+    "react": "^18.2.0"
   }
 }