fix: summernote 최신 버전에서 jQuery require 우회

webpack.config.cjs

@@ -5,6 +5,7 @@ const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPl
 const { resolve } = require('path');
 const CleanTerminalPlugin = require('clean-terminal-webpack-plugin');
 const { ESBuildMinifyPlugin } = require('esbuild-loader')
+const webpack = require('webpack');
 module.exports = (env, argv) => {
     const target = env.target ?? 'hwe';
     const mode = argv.mode ?? 'production';
@@ -267,105 +268,110 @@ module.exports = (env, argv) => {
             }),
             //new BundleAnalyzerPlugin()
         ],
-        cache: {
+    cache: {
-            type: 'filesystem',
+        type: 'filesystem',
         },
-    };
+        externals: {
-    const gateway = {
+            // require("jquery") is external and available
-        name: 'gateway',
+            //  on the global var jQuery
-        resolve: {
+            "jQuery": "jquery"
-            extensions: [".js", ".ts", ".tsx"],
+        }
-        },
+};
-        mode,
+const gateway = {
-        entry: {
+    name: 'gateway',
-            entrance: `${tsDir}/gateway/entrance.ts`,
+    resolve: {
-            user_info: `${tsDir}/gateway/user_info.ts`,
+        extensions: [".js", ".ts", ".tsx"],
-            admin_member: `${tsDir}/gateway/admin_member.ts`,
+    },
-            join: `${tsDir}/gateway/join.ts`,
+    mode,
-            login: `${tsDir}/gateway/login.ts`,
+    entry: {
-            install: `${tsDir}/gateway/install.ts`,
+        entrance: `${tsDir}/gateway/entrance.ts`,
-        },
+        user_info: `${tsDir}/gateway/user_info.ts`,
-        output: {
+        admin_member: `${tsDir}/gateway/admin_member.ts`,
-            filename: '[name].js',
+        join: `${tsDir}/gateway/join.ts`,
-            path: path.resolve(__dirname, 'dist_js'),
+        login: `${tsDir}/gateway/login.ts`,
-        },
+        install: `${tsDir}/gateway/install.ts`,
-        devtool: 'source-map',
+    },
-        optimization: {
+    output: {
-            splitChunks: {
+        filename: '[name].js',
-                cacheGroups: {
+        path: path.resolve(__dirname, 'dist_js'),
-                    commons: {
+    },
-                        test: /[\\/]node_modules[\\/]/,
+    devtool: 'source-map',
-                        name: 'vendors',
+    optimization: {
-                        chunks: 'all',
+        splitChunks: {
-                    },
+            cacheGroups: {
+                commons: {
+                    test: /[\\/]node_modules[\\/]/,
+                    name: 'vendors',
+                    chunks: 'all',
                 },
             },
-            minimizer: [
-                new ESBuildMinifyPlugin({
-                    css: true
-                }),
-            ],
-            moduleIds: 'deterministic',
         },
-        module: {
+        minimizer: [
-            rules: [{
+            new ESBuildMinifyPlugin({
-                test: /\.ts$/,
+                css: true
-                exclude: /(node_modules)/,
-                use: [
-                    {
-                        loader: 'esbuild-loader',
-                        options: {
-                            loader: 'ts',
-                            target: 'es2019',
-                        }
-                    }
-                ]
-            },
-            {
-                test: /\.tsx$/,
-                exclude: /(node_modules)/,
-                use: [
-                    {
-                        loader: 'esbuild-loader',
-                        options: {
-                            loader: 'tsx',
-                            target: 'es2019',
-                        }
-                    }
-                ]
-            },
-            {
-                test: /\.js$/,
-                exclude: /(node_modules)/,
-                use: [
-                    {
-                        loader: 'esbuild-loader',
-                        options: {
-                            loader: 'js',
-                            target: 'es2019',
-                        }
-                    }
-                ]
-            }, {
-                test: /.(s?[ac]ss)$/,
-                use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
-            }]
-        },
-        plugins: [
-            new MiniCssExtractPlugin({
-                filename: '../dist_css/[name].css'
             }),
-            //new BundleAnalyzerPlugin()
         ],
-        cache: {
+        moduleIds: 'deterministic',
-            type: 'filesystem',
+    },
+    module: {
+        rules: [{
+            test: /\.ts$/,
+            exclude: /(node_modules)/,
+            use: [
+                {
+                    loader: 'esbuild-loader',
+                    options: {
+                        loader: 'ts',
+                        target: 'es2019',
+                    }
+                }
+            ]
         },
-    };
+        {
+            test: /\.tsx$/,
+            exclude: /(node_modules)/,
+            use: [
+                {
+                    loader: 'esbuild-loader',
+                    options: {
+                        loader: 'tsx',
+                        target: 'es2019',
+                    }
+                }
+            ]
+        },
+        {
+            test: /\.js$/,
+            exclude: /(node_modules)/,
+            use: [
+                {
+                    loader: 'esbuild-loader',
+                    options: {
+                        loader: 'js',
+                        target: 'es2019',
+                    }
+                }
+            ]
+        }, {
+            test: /.(s?[ac]ss)$/,
+            use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
+        }]
+    },
+    plugins: [
+        new MiniCssExtractPlugin({
+            filename: '../dist_css/[name].css'
+        }),
+        //new BundleAnalyzerPlugin()
+    ],
+    cache: {
+        type: 'filesystem',
+    },
+};
 
-    if (target == 'hwe') {
+if (target == 'hwe') {
-        return [gateway, ingame_vue, ingame];
+    return [gateway, ingame_vue, ingame];
-    }
+}
-    else {
+else {
-        return [ingame_vue, ingame];
+    return [ingame_vue, ingame];
-    }
+}
 }