Merge pull request #333 from ryoppippi/revert-330-feature/webpack

Revert "simplify webpack config"
ryoppippi · Sep 19, 2024 · d250a0f · d250a0f
2 parents 0fbe2e1 + e3ddb9b
commit d250a0f
Show file tree

Hide file tree

Showing 3 changed files with 81 additions and 65 deletions.
diff --git a/examples/webpack-minimal/webpack.config.ts b/examples/webpack-minimal/webpack.config.ts
@@ -4,53 +4,62 @@ import path from 'path';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 import WorkboxWebpackPlugin from 'workbox-webpack-plugin';
 import { Configuration } from 'webpack';
-import { tsImport } from 'tsx/esm/api'
+import * as tsx from 'tsx/cjs/api'
+
+const {default: UnpluginTypia}  = tsx.require('../../packages/unplugin-typia/src/webpack.ts', __filename)
 
 const isProduction = process.env.NODE_ENV == 'production';
 
-module.exports = async () => {
-    /** we use tsImport because of development. However, in real-world projecct, just use `import` instead */
-    // const { default: UnpluginTypia } = await import('@ryoppippi/unplugin-typia/webpack');
-    const { default: UnpluginTypia } = await tsImport('@ryoppippi/unplugin-typia/webpack', __dirname);
 
-    return {
-        mode: isProduction ? 'production' : 'development',
-        entry: './src/index.ts',
-        output: {
-            path: path.resolve(__dirname, 'dist'),
-        },
-        devServer: {
-            open: true,
-            host: 'localhost',
-        },
-        plugins: [
-            new HtmlWebpackPlugin({
-                template: 'index.html',
-            }),
-            UnpluginTypia(),
-            isProduction && new WorkboxWebpackPlugin.GenerateSW(),
-            // Add your plugins here
-            // Learn more about plugins from https://webpack.js.org/configuration/plugins/
-        ],
-        module: {
-            rules: [
-                {
-                    test: /\.(ts|tsx)$/i,
-                    loader: 'ts-loader',
-                    exclude: ['/node_modules/'],
-                },
-                {
-                    test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i,
-                    type: 'asset',
-                },
+const config: Configuration = {
+    entry: './src/index.ts',
+    output: {
+        path: path.resolve(__dirname, 'dist'),
+    },
+    devServer: {
+        open: true,
+        host: 'localhost',
+    },
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: 'index.html',
+        }),
+        UnpluginTypia()     
+        // Add your plugins here
+        // Learn more about plugins from https://webpack.js.org/configuration/plugins/
+    ],
+    module: {
+        rules: [
+            {
+                test: /\.(ts|tsx)$/i,
+                loader: 'ts-loader',
+                exclude: ['/node_modules/'],
+            },
+            {
+                test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i,
+                type: 'asset',
+            },
 
-                // Add your rules for custom modules here
-                // Learn more about loaders from https://webpack.js.org/loaders/
-            ],
-        },
-        resolve: {
-            extensions: ['.tsx', '.ts', '.jsx', '.js', '...'],
-        },
-    } as const satisfies Configuration;
+            // Add your rules for custom modules here
+            // Learn more about loaders from https://webpack.js.org/loaders/
+        ],
+    },
+    resolve: {
+        extensions: ['.tsx', '.ts', '.jsx', '.js', '...'],
+    },
 };
 
+module.exports = () => {
+    if (isProduction) {
+        config.mode = 'production';
+
+        if (config.plugins == null) {
+            config.plugins = []
+        }
+        config.plugins.push(new WorkboxWebpackPlugin.GenerateSW());
+
+    } else {
+        config.mode = 'development';
+    }
+    return config;
+};
diff --git a/packages/unplugin-typia/README.md b/packages/unplugin-typia/README.md
@@ -196,22 +196,28 @@ Examples:
 
 > ⚠️ Note: Currently, this plugin works only with 'esm' target.
 
-> If you want to use 'cjs', use dynamic import.
-
+> If you want to use 'cjs' target on Node < 20.17.0 , please use with [`jiti`](https://github.com/unjs/jiti).
+> If you want to use 'cjs' target on Node >= 20.17.0, please use with `require` and enable [`--experimental-require-modules` flag](https://github.com/nodejs/node/pull/51977).
 > If you want to use 'esm' target, don't worry! You can use this plugin without any additional setup.
 
+```sh
+npm install jiti
+```
+
 ```js
 // webpack.config.js
 
-module.exports = async () => {
-	const { default: UnpluginTypia } = await import('@ryoppippi/unplugin-typia/webpack');
-	return {
-		plugins: [
-			new UnpluginTypia({
-			// options
-			}),
-		],
-	};
+// if you use Node < 20.17.0
+const jiti = require('jiti')(__filename);
+const { default: UnpluginTypia } = jiti('@ryoppippi/unplugin-typia/webpack');
+
+// if you use Node >= 20.17.0
+// const { default: UnpluginTypia } = require("@ryoppippi/unplugin-typia/webpack");
+
+module.exports = {
+	plugins: [
+		UnpluginTypia({ /* options */ }),
+	],
 };
 ```
 

diff --git a/packages/unplugin-typia/src/webpack.ts b/packages/unplugin-typia/src/webpack.ts
@@ -11,7 +11,8 @@ import unplugin from './core/index.js';
  *
  * Currently, this plugin works only with 'esm' target.
  *
- * If you want to use 'cjs' use dynamic import
+ * If you want to use 'cjs' target on Node < 20.17.0 , please use with [`jiti`](https://github.com/unjs/jiti).
+ * If you want to use 'cjs' target on Node >= 20.17.0, please use with `require` and enable [`--experimental-require-modules` flag](https://github.com/nodejs/node/pull/51977).
  * If you want to use 'esm' target, don't worry! You can use this plugin without any additional setup.
  *
  * Refer this issue https://github.com/samchon/typia/issues/1094
@@ -20,16 +21,16 @@ import unplugin from './core/index.js';
  * ```js
  * // webpack.config.js
  *
- * module.exports = async () => {
- *   const { default: UnpluginTypia } = await import('@ryoppippi/unplugin-typia/webpack');
- *     return {
- *       plugins: [
- *         new UnpluginTypia({
- *           // options
- *         }),
- *       ],
- *     };
- * };
+ * // if you use Node < 20.17.0
+ * const jiti = require("jiti")(__filename);
+ * const { default: UnpluginTypia } = jiti("@ryoppippi/unplugin-typia/webpack");
+ *
+ * // if you use Node >= 20.17.0
+ * const { default: UnpluginTypia } = require("@ryoppippi/unplugin-typia/webpack");
+ *
+ * module.exports = {
+ *  plugins: [UnpluginTypia({ /* your config *\/ })],
+ * }
  * ```
  *
  */