From ca16ddc6d7f46321f3c980c6dc9420f8d064bada Mon Sep 17 00:00:00 2001
From: HendricksJudy <61645034+HendricksJudy@users.noreply.github.com>
Date: Mon, 21 Oct 2024 20:30:57 +0300
Subject: [PATCH] Fix critical dependency warning in webpack config

Fixes #777

Replace `require` statements with `import` statements in Webpack configuration files to resolve the critical dependency warning and blank page issue.

* **`demo/configs/webpack/common.js`**
  - Replace `require` statements with `import` statements.
  - Update `module.exports` to `export default`.

* **`demo/configs/webpack/dev.js`**
  - Replace `require` statements with `import` statements.
  - Update `module.exports` to `export default`.

* **`demo/configs/webpack/prod.js`**
  - Replace `require` statements with `import` statements.
  - Update `module.exports` to `export default`.
---
 demo/configs/webpack/common.js | 20 ++++++++------------
 demo/configs/webpack/dev.js    | 15 +++++----------
 demo/configs/webpack/prod.js   | 19 +++++++------------
 3 files changed, 20 insertions(+), 34 deletions(-)

diff --git a/demo/configs/webpack/common.js b/demo/configs/webpack/common.js
index 098f6686f..ffddc4fa7 100644
--- a/demo/configs/webpack/common.js
+++ b/demo/configs/webpack/common.js
@@ -1,16 +1,10 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-// All rights reserved.
+import { resolve } from "path";
+import HtmlWebpackPlugin from "html-webpack-plugin";
+import FriendlyErrorsWebpackPlugin from "friendly-errors-webpack-plugin";
+import CopyPlugin from "copy-webpack-plugin";
+import webpack from "webpack";
 
-// This source code is licensed under the license found in the
-// LICENSE file in the root directory of this source tree.
-
-const { resolve } = require("path");
-const HtmlWebpackPlugin = require("html-webpack-plugin");
-const FriendlyErrorsWebpackPlugin = require("friendly-errors-webpack-plugin");
-const CopyPlugin = require("copy-webpack-plugin");
-const webpack = require("webpack");
-
-module.exports = {
+const config = {
   entry: "./src/index.tsx",
   resolve: {
     extensions: [".js", ".jsx", ".ts", ".tsx"],
@@ -82,3 +76,5 @@ module.exports = {
     }),
   ],
 };
+
+export default config;
diff --git a/demo/configs/webpack/dev.js b/demo/configs/webpack/dev.js
index f2f521623..3e445f331 100644
--- a/demo/configs/webpack/dev.js
+++ b/demo/configs/webpack/dev.js
@@ -1,14 +1,7 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-// All rights reserved.
+import { merge } from "webpack-merge";
+import commonConfig from "./common";
 
-// This source code is licensed under the license found in the
-// LICENSE file in the root directory of this source tree.
-
-// development config
-const { merge } = require("webpack-merge");
-const commonConfig = require("./common");
-
-module.exports = merge(commonConfig, {
+const devConfig = merge(commonConfig, {
   mode: "development",
   devServer: {
     hot: true, // enable HMR on the server
@@ -23,3 +16,5 @@ module.exports = merge(commonConfig, {
   },
   devtool: "cheap-module-source-map",
 });
+
+export default devConfig;
diff --git a/demo/configs/webpack/prod.js b/demo/configs/webpack/prod.js
index b598f486b..b742bf6df 100644
--- a/demo/configs/webpack/prod.js
+++ b/demo/configs/webpack/prod.js
@@ -1,16 +1,9 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-// All rights reserved.
+import { merge } from "webpack-merge";
+import { resolve } from "path";
+import Dotenv from "dotenv-webpack";
+import commonConfig from "./common";
 
-// This source code is licensed under the license found in the
-// LICENSE file in the root directory of this source tree.
-
-// production config
-const { merge } = require("webpack-merge");
-const { resolve } = require("path");
-const Dotenv = require("dotenv-webpack");
-const commonConfig = require("./common");
-
-module.exports = merge(commonConfig, {
+const prodConfig = merge(commonConfig, {
   mode: "production",
   output: {
     filename: "js/bundle.[contenthash].min.js",
@@ -20,3 +13,5 @@ module.exports = merge(commonConfig, {
   devtool: "source-map",
   plugins: [new Dotenv()],
 });
+
+export default prodConfig;