fix: remove node.js dependency in browser (#1081)

Author: himself65

packages/docusaurus-theme-openapi-docs/package.json

@@ -33,6 +33,7 @@
     "@types/crypto-js": "^4.1.0",
     "@types/file-saver": "^2.0.5",
     "@types/lodash": "^4.14.176",
+    "@types/pako": "^2.0.3",
     "concurrently": "^5.2.0",
     "docusaurus-plugin-openapi-docs": "^4.3.3",
     "docusaurus-plugin-sass": "^0.2.3",
@@ -47,10 +48,11 @@
     "crypto-js": "^4.1.1",
     "file-saver": "^2.0.5",
     "lodash": "^4.17.20",
-    "node-polyfill-webpack-plugin": "^3.0.0",
+    "pako": "^2.1.0",
     "postman-code-generators": "^1.10.1",
     "postman-collection": "^4.4.0",
     "prism-react-renderer": "^2.3.0",
+    "process": "^0.11.10",
     "react-hook-form": "^7.43.8",
     "react-live": "^4.0.0",
     "react-magic-dropzone": "^1.0.1",
@@ -62,7 +64,6 @@
     "sass": "^1.80.4",
     "sass-loader": "^16.0.2",
     "unist-util-visit": "^5.0.0",
-    "webpack": "^5.61.0",
     "xml-formatter": "^2.6.1"
   },
   "peerDependencies": {

packages/docusaurus-theme-openapi-docs/src/index.ts

@@ -9,8 +9,6 @@ import path from "path";
 
 import type { Plugin } from "@docusaurus/types";
 
-const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
-
 export default function docusaurusThemeOpenAPI(): Plugin<void> {
   return {
     name: "docusaurus-theme-openapi",
@@ -41,7 +39,11 @@ export default function docusaurusThemeOpenAPI(): Plugin<void> {
       // Avoid conflicts with docusaurus-plugin-sass
       if (sassLoaderRule.length === 0) {
         return {
-          plugins: [new NodePolyfillPlugin()],
+          plugins: [
+            new utils.currentBundler.instance.ProvidePlugin({
+              process: require.resolve("process/browser"),
+            })
+          ],
           module: {
             rules: [
               {
@@ -60,7 +62,11 @@ export default function docusaurusThemeOpenAPI(): Plugin<void> {
         };
       }
       return {
-        plugins: [new NodePolyfillPlugin()],
+        plugins: [
+          new utils.currentBundler.instance.ProvidePlugin({
+            process: require.resolve("process/browser"),
+          })
+        ],
       };
     },
   };

packages/docusaurus-theme-openapi-docs/src/theme/ApiItem/index.tsx

@@ -5,8 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 
-import zlib from "zlib";
-
 import React from "react";
 
 import BrowserOnly from "@docusaurus/BrowserOnly";
@@ -23,13 +21,16 @@ import type { Props } from "@theme/DocItem";
 import DocItemMetadata from "@theme/DocItem/Metadata";
 import SkeletonLoader from "@theme/SkeletonLoader";
 import clsx from "clsx";
-import { ServerObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
-import { ParameterObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
+import {
+  ParameterObject,
+  ServerObject,
+} from "docusaurus-plugin-openapi-docs/src/openapi/types";
 import type { ApiItem as ApiItemType } from "docusaurus-plugin-openapi-docs/src/types";
 import type {
   DocFrontMatter,
   ThemeConfig,
 } from "docusaurus-theme-openapi-docs/src/types";
+import { ungzip } from "pako";
 import { Provider } from "react-redux";
 
 import { createStoreWithoutState, createStoreWithState } from "./store";
@@ -52,6 +53,16 @@ interface SampleFrontMatter extends DocFrontMatter {
   readonly sample?: any;
 }
 
+function base64ToUint8Array(base64: string) {
+  const binary = atob(base64);
+  const len = binary.length;
+  const bytes = new Uint8Array(len);
+  for (let i = 0; i < len; i++) {
+    bytes[i] = binary.charCodeAt(i);
+  }
+  return bytes;
+}
+
 // @ts-ignore
 export default function ApiItem(props: Props): JSX.Element {
   const docHtmlClassName = `docs-doc-id-${props.content.metadata.id}`;
@@ -65,7 +76,7 @@ export default function ApiItem(props: Props): JSX.Element {
   if (api) {
     try {
       api = JSON.parse(
-        zlib.inflateSync(Buffer.from(api as any, "base64") as any).toString()
+        new TextDecoder().decode(ungzip(base64ToUint8Array(api as any)))
       );
     } catch {}
   }