build: resolve EMFILE build errors on Windows (#10100)

**Related Issue:** #9938

## Summary

I resolved the issue linked above in #10024, but it created a new error
on Windows machines:

```text
@esri/calcite-ui-icons:build: 🚨  Error while generating icons.json
@esri/calcite-ui-icons:build: Error: EMFILE: too many open files, open 'C:\Dev\calcite-design-system\packages\calcite-ui-icons\js\cursorMinus16.json'
@esri/calcite-ui-icons:build:     at async open (node:internal/fs/promises:639:25)
@esri/calcite-ui-icons:build:     at async writeFile (node:internal/fs/promises:1219:14)
@esri/calcite-ui-icons:build:     at async Promise.all (index 8189) {
@esri/calcite-ui-icons:build:   errno: -4066,
@esri/calcite-ui-icons:build:   code: 'EMFILE',
@esri/calcite-ui-icons:build:   syscall: 'open',
@esri/calcite-ui-icons:build:   path: 'C:\\Dev\\calcite-design-system\\packages\\calcite-ui-icons\\js\\cursorMinus16.json'
@esri/calcite-ui-icons:build: }
```

This adds back `fs-extra`, which uses `graceful-fs` to prevent EMFILE
errors, as mentioned in their
[README](https://github.com/isaacs/node-graceful-fs#improvements-over-fs-module):

> Queues up open and readdir calls, and retries them once something
closes if there is an EMFILE error from too many file descriptors.

Author: benelan

package-lock.json

@@ -1,4 +1,4 @@
-const { existsSync, mkdirSync } = require("fs");
+const { existsSync, mkdirSync } = require("fs-extra");
 const optimize = require("./optimize");
 const generatePathFile = require("./path-data");
 

packages/calcite-ui-icons/bin/build.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 
-const fs = require("fs");
+const { readdir, writeFile, readFile, mkdirSync, writeFileSync, existsSync } = require("fs-extra");
 const svg2img = require("svg2img");
 const path = require("path");
 const yargs = require("yargs");
@@ -41,8 +41,8 @@ const options = yargs
  */
 function convertSingleIconToPng(svgFilePath, width, height, outputBasePath, outputName, outputSuffix = null) {
   // make sure output base path exists
-  if (!fs.existsSync(outputBasePath)) {
-    fs.mkdirSync(outputBasePath, {
+  if (!existsSync(outputBasePath)) {
+    mkdirSync(outputBasePath, {
       recursive: true,
     });
   }
@@ -58,7 +58,7 @@ function convertSingleIconToPng(svgFilePath, width, height, outputBasePath, outp
       console.log(error);
       process.exit(1);
     }
-    fs.writeFileSync(real_output_path, buffer);
+    writeFileSync(real_output_path, buffer);
   });
 }
 
@@ -81,14 +81,14 @@ function convertIconToXcodeImageSet(svgFilePath, width, height, outputBasePath,
   // read template
   const imagesetTemplatePath = path.join(__dirname, "templates", "imageset.json");
   // create Contents.json for asset catalog asset
-  fs.readFile(imagesetTemplatePath, "utf8", function (error, buffer) {
+  readFile(imagesetTemplatePath, "utf8", function (error, buffer) {
     if (error) {
       console.log(error);
       process.exit(1);
     }
     const contentsJsonBuffer = buffer.replace(/\$\{NAME\}/g, outputName);
     const contentsJsonOutputPath = path.join(outputImagesetPath, "Contents.json");
-    fs.writeFileSync(contentsJsonOutputPath, contentsJsonBuffer);
+    writeFileSync(contentsJsonOutputPath, contentsJsonBuffer);
   });
 }
 
@@ -99,7 +99,7 @@ function convertIconToXcodeImageSet(svgFilePath, width, height, outputBasePath,
 async function indexCalciteIcons(baseIconPath) {
   return new Promise((resolve) => {
     var iconIndex = {};
-    fs.readdir(baseIconPath, function (error, files) {
+    readdir(baseIconPath, function (error, files) {
       if (error) {
         console.log(error);
         process.exit(1);
@@ -138,21 +138,21 @@ async function createCalciteXCAssets(xcAssetsBaseDirectory) {
     // Put in .xcassets folder
     var directory = path.join(xcAssetsBaseDirectory, "calcite.xcassets");
     // Make sure dir exists
-    if (!fs.existsSync(directory)) {
-      fs.mkdirSync(directory, {
+    if (!existsSync(directory)) {
+      mkdirSync(directory, {
         recursive: true,
       });
     }
     // read contents.json template
     let template_path = path.join(__dirname, "templates", "xcassets.json");
     // write out file
-    fs.readFile(template_path, "utf8", function (error, buffer) {
+    readFile(template_path, "utf8", function (error, buffer) {
       if (error) {
         console.log(error);
         process.exit(1);
       }
       const contents_output_path = path.join(directory, "Contents.json");
-      fs.writeFile(contents_output_path, buffer, function (error) {
+      writeFile(contents_output_path, buffer, function (error) {
         resolve(directory);
       });
     });

packages/calcite-ui-icons/bin/convert-mobile.js

@@ -1,4 +1,4 @@
-const { readFile, writeFile } = require("fs/promises");
+const { readFile, writeFile } = require("fs-extra");
 const { glob } = require("glob");
 const SVGO = require("svgo");
 const progress = require("cli-progress");

packages/calcite-ui-icons/bin/optimize.js

@@ -1,8 +1,5 @@
 const camelCase = require("camelcase");
-const {
-  promises: { writeFile, readFile },
-  readFileSync,
-} = require("fs");
+const { writeFile, readFile, readFileSync } = require("fs-extra");
 const { glob } = require("glob");
 const { parse } = require("svgson");
 const path = require("path");

packages/calcite-ui-icons/bin/path-data.js

@@ -1,7 +1,7 @@
 "use strict";
 
 const spriter = require("./index");
-const fs = require("fs");
+const { readFileSync } = require("fs");
 const args = process.argv.slice(2); // skip runtime & script args
 
 function hasArg(name, shorthand) {
@@ -31,7 +31,7 @@ function getConfig() {
 
   if (input) {
     try {
-      const configFileContents = fs.readFileSync(input);
+      const configFileContents = readFileSync(input);
       input = JSON.parse(configFileContents).input;
     } catch (error) {
       process.stderr.write(`config - could not read input: ${error}`);

packages/calcite-ui-icons/lib/spriter/cli.js

@@ -1,6 +1,6 @@
 "use strict";
 
-const { readdir, mkdir, writeFile, readFile } = require("fs/promises");
+const { readdir, mkdir, writeFile, readFile, lstatSync } = require("fs-extra");
 const path = require("path");
 
 const ICONS = path.resolve(path.dirname(process.argv[1]), "../icons");
@@ -11,7 +11,7 @@ const SIZES = [16, 24, 32];
 const OUTLINE = "outline";
 const FILL = "fill";
 
-const isDir = (file) => fs.lstatSync(`${ICONS}/${file}`).isDirectory();
+const isDir = (file) => lstatSync(`${ICONS}/${file}`).isDirectory();
 const readSVG = (icon) => readFile(`${ICONS}/${icon.fileName}`, { encoding: "utf-8" });
 const has = (haystack, needle) => haystack.indexOf(needle) > -1;
 

packages/calcite-ui-icons/lib/spriter/index.js

@@ -58,6 +58,7 @@
     "camelcase": "6.3.0",
     "cli-progress": "^3.12.0",
     "debounce": "^2.1.0",
+    "fs-extra": "11.2.0",
     "glob": "^11.0.0",
     "svg2img": "1.0.0-beta.2",
     "svgo": "^1.3.0",